/* WARHAMMER FANTASY ROLEPLAY 4th EDITION CHARACTER SHEET CSS */
/* Version 1.6 */

/* CHARACTER SHEET */
.ui-dialog .charsheet {
	padding: 1px;
}
.charsheet{
    background-image:url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/assets/parchment.jpg);
    background-size:100%;
	min-width: 820px;
    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
    font-size:14px;
    color:black; 
    text-align:center;
	border: 27px solid transparent;
	border-image: url(https://i.imgur.com/jn8yQ6h.png) 27 round;
	padding: 0px !important;
}

.charsheet h1{
    display:block;
    font-size:2em;
    margin-top:0.67em;
    margin-bottom:0.67em;
    margin-left:0;
    margin-right:0;
    font-weight:bold
}

.sheet-rolltemplate-wfrp4 table a {
    color: #ffcc99;
}

/* REPLACE CHECKBOXES */

input[type="checkbox"] {
    opacity: 0;
    width: 16px;
    height: 16px;
    position: relative;
    left: 10px;
    margin: -6px;
    z-index: 1;
}

input[type="checkbox"] + span::before {
    margin-right: 1px;
    border: solid 1px #a8a8a8;
    line-height: 14px;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    
    -moz-box-shadow: 0 0 2px #ccc;
    -webkit-box-shadow: 0 0 2px #ccc;
    box-shadow: 0 0 2px #ccc;
    
}

input[type="checkbox"] + span::before {
    position:relative;
    content: "";
    background-image:url(http://i.imgur.com/c8Cx2mg.png);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 1;
    width: 20px;
    height: 20px;
    font-size: 10px;
    border:none;
    
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}
input[type="checkbox"]:checked + span::before {
    content: "";
    
    border:none;
    background-image:url(http://i.imgur.com/MOtYDyu.png);
    background-size: 100%;
    background-repeat: repeat;
    background-position: center;
    -moz-box-shadow: 0 0 2px transparent;
    -webkit-box-shadow: 0 0 2px transparent;
    box-shadow: 0 0 2px transparent;
}
input[type="checkbox"]:checked ~ input[type="checkbox"] + span::before {
    background: #f6f6f6;
    background: -moz-radial-gradient(#f6f6f6, #dfdfdf);
    background: -webkit-radial-gradient(#f6f6f6, #dfdfdf);
    background: -ms-radial-gradient(#f6f6f6, #dfdfdf);
    background: -o-radial-gradient(#f6f6f6, #dfdfdf);
    background: radial-gradient(#f6f6f6, #dfdfdf);
}

/* Input Styling */
.charsheet .sheet-wrapper input::-webkit-outer-spin-button,.charsheet .sheet-wrapper input::-webkit-inner-spin-button{
    -webkit-appearance:none;
    background-image:transparent;
    margin:0
}
.charsheet .sheet-wrapper input[type="number"]{
    -moz-appearance:textfield
}
.charsheet .sheet-wrapper button[type="roll"]:before{
    content:"" !important;
    display:none
}
.charsheet .sheet-wrapper button[type="roll"],.charsheet .sheet-wrapper .sheet-btn{
    width:33px;
    height:24px;
    vertical-align:middle;
    padding:0;
    display:inline-block;
    margin:0px;
    font-weight:400;
    
    text-align:center;
    vertical-align:middle;
    background-image:url(https://i.imgur.com/eUjAqIL.jpg);
    background-color:transparent;
    border:1px solid #ccc;
    white-space:nowrap;
    border-radius:4px;
    border-color:#545454;
    -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
}
.charsheet .sheet-wrapper button[type="roll"]:hover,.charsheet .sheet-wrapper .sheet-btn:hover,.charsheet .sheet-wrapper .sheet-hider input[type=checkbox]:checked ~ .sheet-btn{
    background-color:#831010;
    border-color:#831010;
}

/* BUTTONS */
.charsheet .sheet-wrapper button {
    font-size:13px;
    vertical-align:middle;
    text-align:center;
    background-image:none;
    box-shadow:none;
    transition:none;
    border-radius:none;
    border:1px solid black;
    font-weight:700
    color:white;
}

.charsheet .sheet-wrapper button:hover {
    background-image:url ('https://i.imgur.com/xV3ceZB.png');
    background-size:100% 100%;
    background-repeat:no-repeat;
	background-position: center;
    border-color:black;
    color:white;
}

.charsheet .sheet-wrapper button[type="roll"] label,.charsheet .sheet-wrapper button[type="roll"] input{
    height:24px;
    line-height:24px;
    font-size:13px;
    color:#b29a6b;
    text-shadow:none;
    vertical-align:middle;
    text-align:center;
    width:99%;
    background-image:none;
    background:transparent;
    box-shadow:none;
    transition:none;
    border-radius:none;
    border:1px;
    border-color:black;
    font-weight:700
}
.charsheet .sheet-wrapper button[type="roll"]:hover label,.charsheet .sheet-wrapper button[type="roll"]:hover input{
    color:white;
    border-color:black;
}

/* REPEATING FIELD BUTTONS */
.charsheet .repcontrol_add, .repcontrol_del, .repcontrol_edit, .repcontrol_move {
	display: inline-block;
	background: #8a959b;
	color: black;
}
.charsheet .repcontrol_add, .repcontrol_move {
	float: left! important;
}
.charsheet .repcontrol_edit {
	float: right! important;
}
.charsheet .repcontrol_move {
	float: left! important;
	position: absolute;
	bottom: 0px;
	left: 35px;
}
.charsheet .repcontrol_del {
	background:red;
	float: left! important;
	position: absolute;
	bottom: 0px;
	left: 0px;
}
	
	

/* Mouse Cursors */
/* Normal Cursor */
.charsheet
{
    cursor: url(http://i.imgur.com/FaqICyL.png), auto;
}

label
{
    cursor: url(http://i.imgur.com/FaqICyL.png), auto;
}
/* Normal Cursor */
.charsheet .sheet-wrapper button[type="roll"]:hover, label.sheet-labelbutton:hover
{
    cursor: url(http://i.imgur.com/OYpiryU.png) 10 10, auto;
}

/* Write Cursor */
.charsheet .sheet-wrapper input[type=text], input[type=number], textarea
{
    cursor: url(http://i.imgur.com/pY2uaXd.png), auto;
}

/* Select Cursor */
.charsheet .sheet-wrapper select:hover, button:hover, input[type=checkbox]:hover
{
    cursor: url(http://i.imgur.com/OYpiryU.png) 10 10, auto;
}

/* Disabled Cursor */
.charsheet .sheet-wrapper select:disabled, input:disabled
{
    cursor: url(http://i.imgur.com/B3IzNW1.png), auto;
/* cursor: url(http://i.imgur.com/B3IzNW1.png), auto; */
}

/* Special Button Cursor */
/*.charsheet .cursorbutton
{
    cursor: url(http://i.imgur.com/OYpiryU.png) 10 10, auto;
}*/

/* Table Styling */
.charsheet .sheet-wrapper .sheet-table td:first-child{
    width:70%;
    height:24px;
    border-bottom:1px solid black;
    border-bottom-style:dotted;
}
.charsheet .sheet-wrapper .sheet-table td:nth-child(n+2){
    width:24px;
    height:24px;
    border-bottom:1px solid black;
    border-bottom-style:dotted;
    text-align:center
}
/* Zebra Table */

.charsheet .sheet-wrapper .sheet-tablewrapper {
    display:inline-block;
    
    border-radius: 5px;
    padding:2px;
    border: 2px solid #515962;
    background-image: linear-gradient(-45deg,#4c382b, #bc985e, #cfa767, #ffd383);
}

.charsheet .sheet-wrapper .sheet-tablealt table {
    border-collapse: separate;
}
.charsheet .sheet-wrapper .sheet-tablealt .sheet-skilllabel td {
    padding-left:10px;
}
.charsheet .sheet-wrapper .sheet-tablealt tr:nth-child(odd){
    background-image: linear-gradient(#96898d, #9d9698 ,#96898d );
}
.charsheet .sheet-wrapper .sheet-tablealt tr:nth-child(even){
    background-image: linear-gradient(#7b7d82, #84868d ,#7b7d82);
}
.charsheet .sheet-wrapper .sheet-tablealt td:nth-child(1) {
    padding-left:10px;
    background-image: linear-gradient(to right, #c4b8aa 10%, transparent);
}

/* Table Cell Formatting */


/* Headers */
.charsheet .sheet-wrapper .sheet-bluelabel label, .charsheet .sheet-wrapper .sheet-bluelabel td {

    color: #b29a6b;
    background-color: #2f3338; 
    background: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/assets/darkrust.jpg);
    border-image: url(https://i.imgur.com/jgvgJZ4.jpg) 3px round fill;
}



.charsheet .sheet-wrapper hr{
    border:1px #545454;
}

.charsheet .sheet-wrapper div,.charsheet .sheet-wrapper span,.charsheet .sheet-wrapper label,.charsheet .sheet-wrapper h1,.charsheet .sheet-wrapper h2,.charsheet .sheet-wrapper h3,.charsheet .sheet-wrapper h4,.charsheet .sheet-wrapper h5,.charsheet .sheet-wrapper h6,.charsheet .sheet-wrapper p,.charsheet .sheet-wrapper table,.charsheet .sheet-wrapper caption,.charsheet .sheet-wrapper tbody,.charsheet .sheet-wrapper tfoot,.charsheet .sheet-wrapper thead,.charsheet .sheet-wrapper tr,.charsheet .sheet-wrapper th,.charsheet .sheet-wrapper td{
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box
}


.charsheet .sheet-wrapper h3{
    color:black;
    padding:3px;
    margin-bottom:5px;
    font-size:18px;
    font-weight:bold;
    font-family:inherit;
    text-transform:uppercase;
    text-align:center
}
.charsheet .sheet-wrapper h4{
    color:black;
    font-weight:bold;
    font-family:inherit;
    text-transform:uppercase;
    text-align:center
}
.charsheet .sheet-wrapper textarea{
    display:inline-block;
    border:1px solid black;
    padding:2px;
    height:24px;
    width:100%;
    font-size:14px;
    font-family:inherit;
    line-height:16px;
    font-weight:normal;
    margin:0;
    color:black;
    background-color:transparent;
    vertical-align:middle;
    letter-spacing:normal;
    word-spacing:normal;
    text-transform:none;
    text-indent:0px;
    text-shadow:none;
    text-align:start;
    
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    -webkit-writing-mode:horizontal-tb
}

.charsheet .sheet-wrapper  input,.charsheet .sheet-wrapper  select,.charsheet .sheet-wrapper input[type="number"]{
    display:inline-block;
    border-bottom:1px dotted grey;
    border-top:none;
    border-left:none;
    border-right:none;
    padding:2px;
    height:24px;
    width:100%;
    font-size:14px;
    font-family:inherit;
    line-height:16px;
    font-weight:normal;
    color:#000000;
    background-color:transparent;
    vertical-align:middle;
    letter-spacing:normal;
    word-spacing:normal;
    text-transform:none;
    text-indent:0px;
    text-shadow:none;

    -webkit-rtl-ordering:logical;
    -webkit-user-select:text;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);
    -moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);
    box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);
    -webkit-transition:border linear .2s,box-shadow linear .2s;
    -moz-transition:border linear .2s,box-shadow linear .2s;
    -ms-transition:border linear .2s,box-shadow linear .2s;
    -o-transition:border linear .2s,box-shadow linear .2s;
    transition:border linear .2s,box-shadow linear .2s;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    -webkit-writing-mode:horizontal-tb
}

.charsheet .sheet-wrapper input:not([type='checkbox']){
    -webkit-appearance:textfield
}
.charsheet .sheet-wrapper input[type="checkbox"]{
    height:13px;
    width:13px;
    color:#555;
    border:1px solid #000000;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    border-radius:0;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);
    -moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);
    box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);
    -webkit-transition:border linear .2s,box-shadow linear .2s;
    -moz-transition:border linear .2s,box-shadow linear .2s;
    -ms-transition:border linear .2s,box-shadow linear .2s;
    -o-transition:border linear .2s,box-shadow linear .2s;
    transition:border linear .2s,box-shadow linear .2s
}

.charsheet .sheet-wrapper input[disabled],.charsheet .sheet-wrapper select[disabled],.charsheet .sheet-wrapper textarea[disabled],.charsheet .sheet-wrapper input[readonly],.charsheet .sheet-wrapper select[readonly],.charsheet .sheet-wrapper textarea[readonly]{
    background-color:transparent;
    border-color:#000000;
}
.charsheet .sheet-wrapper textarea{
    width:98%;
    height:80px;
    line-height:16px
}
.charsheet .sheet-wrapper label{
    display:inline-block;
    width:100%;
    font-size:14px;
    text-align:left;
    font-weight:600;
    height:24px;
    line-height:24px;
    vertical-align:middle
}
.charsheet .sheet-wrapper .sheet-characteristics button[type="roll"] label,.charsheet .sheet-wrapper .sheet-characteristics button[type="roll"] input.sheet-charMain{
    height:25px;
    line-height:25px;
    font-size:16px;
    font-weight:bold;
    font-family:inherit;
    color:white;
    vertical-align:center;
    text-align:center;
    width:99%;
    background:none;
    box-shadow:none;
    transition:none;
    border-radius:none;
    border:none
}
.charsheet .sheet-wrapper .sheet-characteristics button[type="roll"]:hover label,.charsheet .sheet-wrapper .sheet-characteristics button[type="roll"]:hover input.sheet-charMain{
    color:#fff;
    border:none;
    background-color:#DAA520;
    border-color:#DAA520;
    border-radius:5px
}
.charsheet .sheet-wrapper .sheet-characteristics button[type="roll"]{
    border:none;
    background-color:transparent;
    width:100%;
    margin:auto;
    text-align:center;
    font-family:inherit
}
.charsheet .sheet-wrapper .sheet-characteristics select{
    display:inline-block;
    width:100%;
    text-align:center;
    background-color:transparent;
    border:0;
    font-weight:bold
}
.charsheet .sheet-wrapper .sheet-characteristics input.sheet-charMain{
    display:block;
    border:1px solid gray;
    background-color:transparent;
    width:70%;
    height:65px;
    margin:auto;
    text-align:center;
    font-weight:bolder;
    font-family:inherit;
    font-size:3em
}

.charsheet .sheet-wrapper .sheet-col .sheet-input-selectbox {
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    -webkit-transition:all 0.3s ease-out;
    -moz-transition:all 0.3s ease-out;
    -ms-transition:all 0.3s ease-out;
    -o-transition:all 0.3s ease-out;
    transition:all 0.3s ease-out;
    text-align:center;
    text-align-last:center;
    border: 3px solid transparent;
    border-image: url(https://i.imgur.com/243Hdvq.jpg);
    border-image-slice: 3 ;
    border-image-repeat: round;
    border-image-outset: 1px;
    padding: 0px;
    margin: 0px;
    background: #a29a8c;
    

}

/* BUTTONS */
input.sheet-arrow[type="checkbox"]{
    opacity:0;
    width:20px;
    height:20px;
    position:relative;
    top:0px;
    left:16px;
    z-index:1
}
.charsheet .sheet-wrapper .sheet-item{
    display:inline-block;
    width:100%;
    height:28px;
    vertical-align:middle;
    margin:0 -2px;
    text-align:left;
    padding:3px 2px
}
input.sheet-arrow[type="checkbox"] + span::before{
    background:url("https://i.imgur.com/dFig3jt.png");
    background-size:20px 20px;
    background-repeat:no-repeat;
    background-position:center;
    content:"";
    line-height:14px;
    text-align:center;
    display:inline-block;
    vertical-align:middle;
    border-radius:10px;
    border:1px solid black;
    width:20px;
    height:20px
}
input.sheet-arrow[type="checkbox"]:checked + span::before{
    background:url("https://i.imgur.com/2V2A4qm.png");
    background-size:20px 20px;
    background-repeat:no-repeat;
    background-position:center;
    content:"";
    width:20px;
    height:20px
}
input.sheet-arrow[type="checkbox"]:hover + span::before{
    background:url("https://i.imgur.com/Ig3Ww6v.png");
    background-size:20px 20px;
    background-repeat:no-repeat;
    background-position:center;
    content:"";
    line-height:14px;
    text-align:center;
    display:inline-block;
    vertical-align:middle;
    border-radius:10px;
    border:1px solid black;
    width:20px;
    height:20px
}

div.sheet-body{
    display:none
}
input.sheet-arrow:checked ~ div.sheet-body{
    display:block
}
table.sheet-armortable{
	background-image:url("https://i.imgur.com/ohregeQ.png");
	background-size: 60% 80%;
	background-repeat: no-repeat;
	background-position: center 70px; 
}
td.sheet-armorshield{
	background-image:url("https://i.imgur.com/c4KfHLg.png");
	background-size: 95% auto;
	background-repeat: no-repeat;
	background-position: center 37px;
}

.sheet-rolltemplate-wfrp4 table {
    background-image:url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/assets/darkrust.jpg);
    min-width:220px;
    max-width:220px;
    width: 100%;
    padding: 5px;
    border: 10px solid transparent;
	border-collapse: separate;
	border-image: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/assets/darkborder.jpg) 10 round;
	border-image-width: 10px;
	font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
	color:#cebbb3;
}

.sheet-rolltemplate-wfrp4 th {
    width: 100%;
	border: 0px solid;
	font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
}

.sheet-rolltemplate-wfrp4 .userscript-tcat {
    color: black;
}

.sheet-rolltemplate-wfrp4 td {
	padding: 1px;

}

.sheet-rolltemplate-wfrp4 hr {
	padding: 1px;

}

.sheet-rolltemplate-wfrp4 div {
	padding: 1px;

}

.sheet-rolltemplate-wfrp4 .inlinerollresult  {
	display: inline-block;
	min-width: 1.5em;
	text-align: center;
	background-color:black;
	border: 2px solid #483c3e;
}

.sheet-rolltemplate-wfrp4 .inlinerollresult.fullcrit {
	border: 2px solid #3FB315;
}

.sheet-rolltemplate-wfrp4 .inlinerollresult.fullfail {
	border: 2px solid #B31515;
}

.sheet-rolltemplate-wfrp4 .inlinerollresult.importantroll {
	border: 2px solid #4A57ED;
}

.sheet-rolltemplate-wfrp4 .sheet-rollcharacter {
    font-size: 1.5em;
    line-height: 1em;
    color:white;
}

.sheet-rolltemplate-wfrp4 .sheet-rolltitle {
    font-size: 1.25em;
    line-height: 1.2em;
    font-style: italic;
}

/*Sheet tabs*/

label.sheet-tab{
    text-align:center;
    display:inline-block;
    font-size:14px;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    -webkit-transition:all 0.3s ease-out;
    -moz-transition:all 0.3s ease-out;
    -ms-transition:all 0.3s ease-out;
    -o-transition:all 0.3s ease-out;
    transition:all 0.3s ease-out;
    text-align:center;
    text-align-last:center;
    border: 3px solid transparent;
    cursor: url(http://i.imgur.com/OYpiryU.png) 10 10, auto;
    border-image: url(https://i.imgur.com/243Hdvq.jpg);
    border-image-slice: 3 ;
    border-image-repeat: round;
    border-image-outset: 1px;
    background: #a29a8c;
    
    color:black;
    font-weight:bold;
    border-radius:10px;
    line-height:30px;
    width:14%;
    height:30px;
    position:relative;
    vertical-align:middle;
    text-shadow:4px 4px 5px rgba(150, 150, 150, 0.5);
    margin-left:-12%;
    text-indent:12px
}
input.sheet-tab{
    width:14%;
    height:30px;
    cursor: url(http://i.imgur.com/OYpiryU.png) 10 10, auto;
    position:relative;
    opacity:0;
    z-index:9999
}
input.sheet-tab:checked + label{
    background-image:url ('https://i.imgur.com/xV3ceZB.png');
    background-size:100% 100%;
    background-repeat:no-repeat;
	background-position: center;
    border-color:black;
    color:white;
}
div.sheet-tab-content{
    display:none
}
input.sheet-tabMain:checked ~ div.sheet-tabMain,input.sheet-tabInformation:checked ~ div.sheet-tabInformation,input.sheet-tabGearMagic:checked ~ div.sheet-tabGearMagic,input.sheet-tabSkillsTalents:checked ~ div.sheet-tabSkillsTalents,input.sheet-tabExperience:checked ~ div.sheet-tabExperience{
    display:block
}
input.sheet-tabPC:checked ~ div.sheet-tabPC,input.sheet-tabGM:checked ~ div.sheet-tabGM{
    display:block
}
input.sheet-tabNPC:checked ~ div.sheet-tabNPC{
    display:block
}