Files

1574 lines
38 KiB
CSS

/* CSS RATAS EN LAS PAREDES - THE HILL PRESS */
/* Character sheet for ROll20 by VJ Rolmasters*/
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Smooch&family=Special+Elite&family=Splash&family=Uchen&display=swap');
/*============= FONTS CSS =============*/
.special-elite-regular {
font-family: "Special Elite", system-ui;
font-weight: 400;
font-style: normal;
}
.smooch-regular {
font-family: "Smooch", cursive;
font-weight: 400;
font-style: normal;
}
.splash-regular {
font-family: "Splash", cursive;
font-weight: 400;
font-style: normal;
}
.caveat {
font-family: "Caveat", cursive;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
.uchen-regular {
font-family: "Uchen", serif;
font-weight: 400;
font-style: normal;
}
/* BASIC TAB STYLES */
.sheet-contenedorvj {
position: relative;
width: 860px;
height: auto;
min-height: 1200px;
max-height: 1200px;
margin: 0px auto;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_FONDO_A9_860px.png");
background-repeat: no-repeat;
background-size:cover;
background-position: center;
}
.sheet-cap {
position: relative;
float: left;
width: 760px;
margin: 30px 0px 0px 50px;
height: auto;
min-height: 310px;
max-height: 310px;
box-sizing:border-box;
}
.sheet-clip {
position: absolute;
left: 38px;
top: 4px;
float: left;
width: 60px;
height: auto;
min-height: 107px;
max-height: 107px;
box-sizing:border-box;
z-index:2;
}
.sheet-avatar-foto {
float: left;
position: relative;
width: 145px;
height: 195px;
max-height: 195px;
margin: 58px 0 0 38px;
padding: 0;
border: 1px solid #000000;
transform: rotate(4deg);
-webkit-transform: rotate(4deg); /* Safari / Chrome viejos */
-moz-transform: rotate(4deg); /* Firefox viejos */
-ms-transform: rotate(4deg); /* Internet Explorer 9+ */
-o-transform: rotate(4deg); /* Opera antiguos */
transform-origin: center center;
z-index:1;
overflow: hidden;
}
.sheet-avatar-foto img{
float: none;
box-sizing: border-box;
width: 100%;
height: auto;
position: relative;
margin: 0px;
padding: 0px 0px 0px 0px;
text-align: center;
}
.sheet-dadoextra{
float: right;
width: 200px;
height: auto;
min-height: 30px;
margin: 275px 0px 0px 0px;
}
.sheet-barralanzadados{
float: left;
width: 100px;
height: auto;
min-height: 30px;
margin: 0px 5px 0px 0px;
border: 2px solid #000000;
text-align: center;
color: #000000;
font-family: "Special Elite", system-ui;
font-size: 18px;
cursor: pointer;
background-color: transparent;
}
.sheet-container {
position: relative;
float: left;
width: 700px;
margin: 0px 0px 0px 110px;
height: auto;
min-height: 790px;
max-height: 790px;
box-sizing:border-box;
}
/* Vertical tabs */
.sheet-notebook-tabs {
position: absolute;
right: -37px;
top: 0px;
display: flex;
flex-direction: column;
gap: 6px;
z-index: 10;
}
.sheet-notebook-tab {
width: 28px;
height: 90px;
background:#a7a7a7;
color:#000000;
border:none;
border-radius:0 0px 0px 0;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
font-weight:bold;
font-size:12px;
text-transform:uppercase;
writing-mode: vertical-rl;
text-orientation: mixed;
box-shadow:2px 2px 4px rgba(0,0,0,0.2);
}
.sheet-notebook-tab:hover {
background:#000000;
color: #ffffff;
}
/* Ocultar todas las pestañas */
.charsheet .sheet-pj,
.charsheet .sheet-combate,
.charsheet .sheet-trasfondo,
.charsheet .sheet-recursos,
.charsheet .sheet-magia {
display: none !important;
}
/* Mostrar según valor del input */
.charsheet .sheet-tabstoggle[value="pj"] ~ .sheet-container .sheet-pj,
.charsheet .sheet-tabstoggle[value="combate"] ~ .sheet-container .sheet-combate,
.charsheet .sheet-tabstoggle[value="trasfondo"] ~ .sheet-container .sheet-trasfondo,
.charsheet .sheet-tabstoggle[value="recursos"] ~ .sheet-container .sheet-recursos,
.charsheet .sheet-tabstoggle[value="magia"] ~ .sheet-container .sheet-magia {
display: block !important;
}
/* Botones activos */
.charsheet .sheet-tabstoggle[value="pj"] ~ .sheet-container .sheet-notebook-tabs .sheet-button0,
.charsheet .sheet-tabstoggle[value="combate"] ~ .sheet-container .sheet-notebook-tabs .sheet-button1,
.charsheet .sheet-tabstoggle[value="trasfondo"] ~ .sheet-container .sheet-notebook-tabs .sheet-button2,
.charsheet .sheet-tabstoggle[value="recursos"] ~ .sheet-container .sheet-notebook-tabs .sheet-button3,
.charsheet .sheet-tabstoggle[value="magia"] ~ .sheet-container .sheet-notebook-tabs .sheet-button4 {
background: #c5c5c3;
color: #000000;
width: 45px;
box-shadow: 2px 2px 6px rgba(0,0,0,0.28);
border-radius: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RelP_FONDO_BOTON_A1.jpg");
background-repeat: no-repeat;
background-size:contain;
background-position: center;
}
/*============= CONTENEDORES Y COLUMNAS CSS =============*/
.sheet-separa20{
float: none;
position: relative;
width: 100%;
height: 20px;
margin: 0px auto;
}
.sheet-separa30{
float: none;
position: relative;
width: 100%;
height: 30px;
margin: 0px auto;
}
.sheet-clearfloat {
clear:both;
height:0;
font-size: 0px;
line-height:0px;
}
.sheet-espai-100{
float: left;
position: relative;
width: 100%;
height: 100px;
margin: 0px auto;
}
.ui-dialog .charsheet {
padding: 0px 0px;
}
/*============= PERSONAJE TAB 1 CSS =============*/
.sheet-titulo-1 {
position: relative;
float: left;
width: 620px;
margin: 0px 0px 0px 0px;
height: auto;
min-height: 30px;
box-sizing:border-box;
font-family: "Uchen", serif;
font-size:25px;
text-align: left;
color:#000000;
text-transform:uppercase;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_RAYA_DOBLE_A4_35px.png");
background-repeat: no-repeat;
background-size:contain;
background-position: left;
}
.sheet-titulo-2 {
position: relative;
float: left;
width: 300px;
margin: 0px 0px 0px 0px;
height: auto;
min-height: 30px;
box-sizing:border-box;
font-family: "Uchen", serif;
font-size:25px;
text-align: center;
color:#000000;
text-transform:uppercase;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_RAYA_DOBLE_B_300px.png");
background-repeat: no-repeat;
background-size:contain;
background-position: left;
}
.sheet-titulo-customA{
float:left;
position:relative;
width:100%;
height:30px;
margin: 0px 0px 0px;
padding: 0px 0px 0px 0px;
font-family: "Uchen", serif;
font-size:25px;
text-align: left;
color:#000000!important;
text-transform:uppercase;
background-color: transparent;
border: none;
outline: 0px;
}
.sheet-titulo-customA::placeholder{
font-family: "Uchen", serif;
font-size:25px;
text-align: left;
color:#000000!important;
text-transform:uppercase;
}
.sheet-titulo-customB{
float:left;
position:relative;
width:100%;
height:30px;
margin: 0px 0px 0px;
padding: 0px 0px 0px 0px;
font-family: "Uchen", serif;
font-size:25px;
text-align: left;
color:#000000!important;
text-transform:uppercase;
background-color: transparent;
border: none;
outline: 0px;
}
.sheet-titulo-customB::placeholder{
font-family: "Uchen", serif;
font-size:25px;
text-align: left;
color:#000000!important;
text-transform:uppercase;
}
.sheet-etiqueta-info{
float: left;
width: auto;
height:auto;
margin:10px 10px 0px 10px;
text-align: left;
font-size: 18px;
font-family: "Special Elite", system-ui;
color: #000000;
}
.sheet-characterinfo1{
position: relative;
float: left;
width:450px;
height:auto !important;
margin:0px 0px;
padding: 0px 0px 0px 0px ;
border-top: none;
border-left: none ;
border-right: none;
border-bottom: none;
outline: 0px;
text-align: left;
font-family: "Caveat", cursive;
font-size: 30px!important;
color:darkred;
background-color: transparent;
}
.sheet-characterinfo2{
position: relative;
float: left;
width:50px;
height:auto !important;
margin:0px 0px;
padding: 0px 0px 0px 0px ;
border-top: none;
border-left: none ;
border-right: none;
border-bottom: none;
outline: 0px;
text-align: center;
font-family: "Caveat", cursive;
font-size: 32px!important;
color:darkred;
background-color: transparent;
}
.sheet-characterinfo3{
position: relative;
float: left;
width:250px;
height:auto !important;
margin:0px 0px;
padding: 0px 0px 0px 0px ;
border-top: none;
border-left: none ;
border-right: none;
border-bottom: none;
outline: 0px;
text-align: left;
font-family: "Caveat", cursive;
font-size: 32px!important;
color:darkred;
background-color: transparent;
}
.sheet-characterinfo2espacio{
position: relative;
float: left;
width:60px;
height:18px;
margin:0px 0px;
padding: 0px 0px 0px 10px ;
}
.sheet-separador-raya-1 {
position: relative;
float: left;
width: 100%;
margin: 0px 0px 0px 0px;
height: 7px;
min-height: 7px;
box-sizing:border-box;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_RAYA_A2_613px.png");
background-repeat: no-repeat;
background-size:contain;
background-position: top left;
}
.sheet-atributos650{
float:left;
position:relative;
width:600px;
height:auto;
margin: 0% 0% 0% 0%;
padding: 0px;
}
.sheet-atributobox{
float:left;
position:relative;
width:18%;
height:auto;
margin: 0% 1% 0% 1%;
padding: 0px;
}
.sheet-atributotitulo{
position: relative;
float: left;
width:100%;
height:20px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px ;
border-top: none;
border-left: none ;
border-right: none;
border-bottom: 1px solid #000000;
outline: 0px;
text-align: center;
font-family: "Special Elite", system-ui;
font-size: 18px;
color:#000000;
background-color: transparent;
}
.sheet-atributonumero{
position: relative;
float: left;
width: 50px !important;
height:50px!important;
margin: 0px 0px 0px 30px;
padding: 0px 0px 0px 0px ;
outline: 0px;
border-top: none;
border-left: none ;
border-right: none;
border-bottom: 1px solid #000000;
text-align: center;
font-family: "Caveat", cursive;
font-size: 50px!important;
color:darkred;
background-color: transparent;
}
.sheet-atributodado{
position: relative;
float: left;
width: 50px;
height:30px;
margin: 5px 0px 0px 30px;
padding: 0px 0px 0px 0px ;
outline: 0px;
}
.sheet-atributodadoG{
position: relative;
float: left;
width: 80px;
height:43px;
margin: 5px 0px 0px 15px;
padding: 0px 0px 0px 0px ;
outline: 0px;
}
.sheet-check-options{
width: 15px!important;
height: 15px!important;
color:black; accent-color:black;
border-color: black;
}
.sheet-textarea-cicatrices{
position: relative;
float: left;
width:580px!important;
height:200px!important;
max-height: 300px!important;
margin: 5px 0px 0px 20px;
padding: 5px 15px;
resize: none;
box-sizing: border-box;
border:none!important;
background-color: transparent;
font-size: 24px; font-family: 'Caveat', cursive;
line-height: 24px;
color: darkred;
scrollbar-color: #000000 transparent;
scrollbar-width: thin;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_FONDO_RAYAS_TEXTAREA_580px.png");
background-repeat: no-repeat;
background-size:auto ;
background-position: top;
}
/*=================== COMBATE TAB 2 CSS ===================*/
.sheet-armabox100{
float:none;
width:100%;
height:auto;
min-height: 30px;
margin: 0px auto;
padding: 0px 0px;
box-sizing: border-box;
display: inline-block;
}
.sheet-armas{
float:left;
width:625px;
height: auto;
max-height: 300px;
min-height: 300px;
margin: 0px auto;
padding: 0px;
box-sizing: border-box;
overflow-y: auto;
scrollbar-color: #000000 transparent;
scrollbar-width: thin;
}
.sheet-armaselect-A,
.sheet-armaselect-B {
position: relative;
float: left;
height: 30px !important;
margin: 0 0 0 5px !important;
border: none;
border-bottom: 1px solid #000 !important;
outline: 0;
background-color: transparent !important;
font-family: "Brawler", serif;
font-size: 14px;
font-weight: bold;
text-align: center;
color: #000;
-moz-appearance: textfield;
-webkit-appearance: none;
}
.sheet-armaselect-A { width: 45px !important; }
.sheet-armaselect-B { width: 150px !important; }
.sheet-item2A{
position: relative;
float: left;
width: 180px !important;
height: 30px !important;
margin: 0px 0px 0px 5px;
border: none;
border-bottom: 1px solid #000 !important;
outline: none;
background: transparent !important;
font-family: "Brawler", serif;
font-size: 14px;
font-weight: bold;
text-align: left;
color: #000;
appearance: textfield; /* reemplaza a -webkit y -moz */
}
.sheet-item2C{
position: relative;
float: left;
width: 340px !important;
height: 30px !important;
margin: 0px 0px 0px 40px;
border: none;
border-bottom: 1px solid #000 !important;
outline: none;
background: transparent !important;
text-align: left;
font-family: "Caveat", cursive;
font-size: 24px!important;
color:darkred;
font-weight: bold;
appearance: textfield; /* reemplaza a -webkit y -moz */
}
.sheet-consecuencias{
float:left;
position:relative;
width:600px;
height:auto;
min-height: 30px;
margin: 0px 0px 0px 10px;
padding: 0px 0px;
box-sizing: border-box;
display: inline-block;
text-align: left;
font-family: "Special Elite", system-ui;
font-size: 16px;
color:#000000;
}
/*============= TRASFONDO TAB 3 CSS =============*/
.sheet-textarea-trasfondo-A{
position: relative;
float: left;
width:580px!important;
height:300px!important;
max-height: 300px!important;
margin: 5px 0px 0px 20px!important;
padding: 5px 15px;
resize: none;
box-sizing: border-box;
background-color: transparent;
border-top: none;
border-left: none;
border-right: none;
border-bottom: 2px solid #000000;
font-size: 24px;
font-family: 'Caveat', cursive;
line-height: 24px;
color: darkred;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_FONDO_RAYAS_TEXTAREA_580px.png");
background-repeat: no-repeat;
background-size:contain;
background-position: left;
scrollbar-color: #000000 transparent;
scrollbar-width: thin;
}
.sheet-textarea-trasfondo-C{
position: relative;
float: left;
width:580px!important;
height:200px!important;
max-height: 300px!important;
margin: 5px 0px 0px 20px!important;
padding: 5px 15px;
resize: none;
box-sizing: border-box;
background-color: transparent;
border: 2px solid #000000;
font-size: 14px;
font-family: 'Special Elite', system-ui;
line-height: 24px;
color: #000000;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_FONDO_RAYAS_TEXTAREA_580px.png");
background-repeat: no-repeat;
background-size:auto ;
background-position: top;
scrollbar-color: #000000 transparent;
scrollbar-width: thin;
}
.sheet-textarea-trasfondo-B{
position: relative;
float: left;
width:275px!important;
height:270px!important;
max-height: 270px!important;
margin: 5px 0px 0px 10px!important;
padding: 5px 15px;
resize: none;
box-sizing: border-box;
background-color: transparent;
border-top: none;
border-left: none;
border-right: none;
border-bottom: 2px solid #000000;
font-size: 24px;
font-family: 'Caveat', cursive;
line-height: 24px;
color: darkred;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_FONDO_RAYAS_TEXTAREA_265px.png");
background-repeat: no-repeat;
background-size:contain;
background-position: left;
scrollbar-color: #000000 transparent;
scrollbar-width: thin;
}
/*============= MAGIA TAB 5 CSS =============*/
.sheet-hechiceria{
float:left;
width:625px;
height: auto;
max-height: 420px;
min-height: 420px;
margin: 0px auto;
padding: 0px;
box-sizing: border-box;
overflow-y: auto;
scrollbar-color: #000000 transparent;
scrollbar-width: thin;
border-top: none;
border-left: none;
border-right: none;
border-bottom: 2px solid #000000;
}
.sheet-hechizo{
position: relative;
float: left;
width: 360px !important;
height: 30px !important;
margin: 0px 0px 0px 40px;
border: none;
border-bottom: 1px solid #000 !important;
outline: none;
background: transparent !important;
text-align: left;
font-family: "Caveat", cursive;
font-size: 24px!important;
color:darkred;
font-weight: bold;
appearance: textfield; /* reemplaza a -webkit y -moz */
}
.sheet-dadoshechizo{
position: relative;
float: left;
width: 50px !important;
height: 30px !important;
margin: 0px 0px 0px 20px;
border: none;
}
details{
width: 590px;
color: #000000 !important;
padding: 5px 0px 0px;
cursor: pointer;
}
details:hover{
color: darkred !important;
padding: 5px 0px 0px;
cursor: pointer;
}
.sheet-itemmagiadetalles{
float: none;
width: 300px;
height: auto;
min-height: 35px;
margin: 0px auto 5px ;
}
.sheet-magiadetalles textarea{
float: none;
width: 600px;
height: 30px;
min-height: 50px;
margin: 5px 5px;
resize: vertical;
box-sizing: border-box;
outline: 0px;
font-family: "Brawler", serif;
font-size: 14px;
color: #000000;
background-color: transparent; border: 1px solid #000000;
}
/*============= GENERAL CSS =============*/
.sheet-width100{
float:left;
position:relative;
width:100%;
height:auto;
min-height: 30px;
margin: 0px 0px;
padding: 0px 0px;
box-sizing: border-box;
display: inline-block;
}
.sheet-cos620{
float:left;
position:relative;
width:620px;
height:auto;
min-height: 30px;
margin: 0px 0px;
padding: 0px 0px;
box-sizing: border-box;
display: inline-block;
text-align: center;
font-family: "Special Elite", system-ui;
font-size: 16px;
color:#000000;
}
.sheet-columnamig{
float:left;
position:relative;
width:48%;
height:auto;
margin: 0% 1% 0% 1%;
padding: 0px;
overflow: hidden;
}
.charsheet .sheet-invisible {
display: none;
}
/*============= ESPACIADORES Y SEPARADORES CSS =============*/
[class^="sheet-espai-"] {
float: left;
position: relative;
width: 100%;
margin: 0 auto;
padding: 0;
}
/* === Alturas específicas === */
.sheet-espai-5 { height: 5px; }
.sheet-espai-7 { height: 7px; }
.sheet-espai-10 { height: 10px; }
.sheet-espai-15 { height: 15px; }
.sheet-espai-20 { height: 20px; }
.sheet-espai-30 { height: 30px; }
.sheet-espai-40 { height: 40px; }
.sheet-espai-60 { height: 60px; }
/*============= REPCONTROL BOTONS CSS =============*/
.repcontrol {
display: flex;
width: 96%;
justify-content: flex-end;
clear: both;
}
.repcontrol_add,
.repcontrol_edit,
.repcontrol_add:hover,
.repcontrol_edit:hover,
.repcontrol_add:active,
.repcontrol_edit:active
.repcontrol_add:focus,
.repcontrol_edit:focus{
width: 2em;
height: 1.2em;
margin: 1px;
padding: 0 1px 3px 1px;
box-shadow: none;
color: transparent !important;
text-shadow: none;
outline: transparent !important;
}
.repcontrol_move {
float: left;
margin-left: 5px;
cursor: move;
}
button.btn.repcontrol_del:after,
button.btn.repcontrol_del:hover {
color: black;
}
button.btn.repcontrol_edit:after {
font-family: Pictos;
content: '(';
color: black;
margin: 0 0 0 -45px;
}
.repcontainer.ui-sortable.editmode ~ .repcontrol button.btn.repcontrol_edit:after {
margin: 0 0 0 -28px;
content: ')';
}
button.btn.repcontrol_add:after {
font-family: Pictos;
content: '&';
color: black;
margin: 0 0 0 -31px;
}
button.btn:hover.repcontrol_edit:after,
button.btn:hover.repcontrol_add:after,
button.btn:hover.repcontrol_del:after {
color: darkgreen;
}
a.btn.repcontrol_move:hover {
color: darkgreen;
}
button.btn.btn-danger.pictos.repcontrol_del:hover {
color: #fff;
}
/*============= DADOS CSS =============*/
.charsheet button[type="roll"].sheet-VJ2d6:before{
content: ' '!important;
}
.charsheet button[type="roll"].sheet-VJ2d6:hover{
background-position: 0; background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_DADOS_D6_BLANCOS_A1_50px.png")!important;
}
.charsheet button[type="roll"].sheet-VJ2d6{
float: left;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_DADOS_D6_NEGROS_A1_50px.png")!important ;
background-size: auto;
background-repeat:no-repeat;
width: 50px;
height: 27px;
border-style: none;
background-color: transparent;
margin-left: 0px;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
}
.ui-dialog .charsheet button[type=roll]::before {
font-family: none!important;
border: none;
background-color: transparent;
color: transparent!important;
}
/*============= DADOS GRANDES CSS =============*/
.charsheet button[type="roll"].sheet-VJ2d6G:before{
content: ' '!important;
}
.charsheet button[type="roll"].sheet-VJ2d6G:hover{
background-position: 0; background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_DADOS_D6_BLANCOS_A1_80px.png")!important;
}
.charsheet button[type="roll"].sheet-VJ2d6G{
float: left;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_DADOS_D6_NEGROS_A1_80px.png")!important ;
background-size: auto;
background-repeat:no-repeat;
width: 80px;
height: 43px;
border-style: none;
background-color: transparent;
margin-left: 0px;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
}
/*=================== FIRMA CSS ===================*/
.sheet-firma-foot {
position: relative;
float: left;
width: 100%;
height: 20px;
min-height: 20px;
margin: 30px auto 5px;
font-family: "Uchen", serif;
font-weight: 500;
font-size: 10px;
text-align: center;
color: #000000;
}
/*=================== MEDIA CSS ===================*/
@media screen and (min-width: 940px){
.sheet-contenedorvj {
position: relative;
width: 860px;
height: 1200px;
min-height: 1200px;
margin: 0px auto;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_FONDO_COLOR_B2_860px.png");
background-repeat: no-repeat;
background-size:cover;
background-position: center;
}
.sheet-notebook-tab {
background:#deb878;
}
.charsheet .sheet-tabstoggle[value="pj"] ~ .sheet-container .sheet-notebook-tabs .sheet-button0,
.charsheet .sheet-tabstoggle[value="combate"] ~ .sheet-container .sheet-notebook-tabs .sheet-button1,
.charsheet .sheet-tabstoggle[value="trasfondo"] ~ .sheet-container .sheet-notebook-tabs .sheet-button2,
.charsheet .sheet-tabstoggle[value="recursos"] ~ .sheet-container .sheet-notebook-tabs .sheet-button3,
.charsheet .sheet-tabstoggle[value="magia"] ~ .sheet-container .sheet-notebook-tabs .sheet-button4 {
background: #e5d2b2;
background-image: none;
background-repeat: no-repeat;
background-size:contain;
background-position: center;
}
}
@media screen and (min-width: 1000px){
.sheet-contenedorvj{
}
}
@media screen and (min-width: 1050px){
.sheet-contenedorvj{
}
}
@media screen and (min-width: 1100px){
.sheet-contenedorvj{
}
}
/*============= CHECK CSS =============*/
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0; }
/* Firefox */
input[type=number] {
-moz-appearance: textfield; }
/*=================== RATAS EN LAS PAREDES ROLL ROLLTEMPLATE CSS ===================*/
/* Smaller margins - remove these if you want the huge default left margin */
.sheet-rolltemplate-ratas {
margin-left: -37px;
}
.sheet-rolltemplate-ratas .sheet-fotofondo {
width: 300px;
height: auto;
min-height: 200px;
overflow: auto;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/TEMPLATE_FONDO_RATAS_A5_400px.png");
background-repeat: no-repeat;
background-size:cover;
background-position: top;
box-sizing: border-box;
border-top: none;
}
/* Header formatting - title and subtitle */
.sheet-rolltemplate-ratas .sheet-header {
height: 45px;
/* change text-align to center to center the header text */
padding: 5px;
}
.sheet-rolltemplate-ratas .sheet-title {
font-family: "Special Elite", system-ui;
font-size: 24px;
font-weight: bold;
margin: 12px 0px 0px 0px;
text-align: center;
color: #000000;
text-transform: uppercase;
}
.sheet-rolltemplate-ratas .sheet-subtitle {
font-family: "Special Elite", system-ui;
font-size: 14px;
font-weight: bold;
margin: 2px 0px 0px 0px;
text-align: center;
color: #ff0000;
}
.textchatcontainer .inlinerollresult {
background-color: #fef68e;
border: 2px solid #fef68e;
padding: 3px 3px 0px 3px!important;
font-weight: bold;
cursor: help;
/* line-height: 20px; */
font-size: 1.1em;
}
/* Make even-numbered rows grey */
.sheet-rolltemplate-ratas .sheet-contento :nth-child(1n+3),
.sheet-rolltemplate-ratas .sheet-contento :nth-child(1n) {
background-color: transparent !important;
border: none!important;
}
.sheet-rolltemplate-ratas .textchatcontainer .inlinerollresult {
background-color: #fef68e;
border: 2px solid #fef68e;
padding: 0px 3px 0px 3px;
font-weight: bold;
cursor: help;
font-size: 1.9em!important;
}
.sheet-rolltemplate-ratas .sheet-filatemplate1R{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 40px;
margin: 20px 5% 0px 5%;
padding: 8px 0px 0px;
color: #ff0000!important;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 50px!important;
font-style: normal;
}
.sheet-rolltemplate-ratas .sheet-filatemplate1V{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 40px;
margin: 20px 5% 0px 5%;
padding: 8px 0px 0px;
color: darkgreen!important;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 50px!important;
font-style: normal;
}
.sheet-rolltemplate-ratas .sheet-filatemplate2{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 15px;
margin: 0% 5%;
padding: 0px 0px 10px 0px;
color: #000000;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 24px;
font-style: normal;
}
/*=================== RATAS EN LAS PAREDES COMBATE ROLL ROLLTEMPLATE CSS ===================*/
/* Smaller margins - remove these if you want the huge default left margin */
.sheet-rolltemplate-ratascombate {
margin-left: -37px;
}
.sheet-rolltemplate-ratascombate .sheet-fotofondo {
width: 300px;
height: auto;
min-height: 200px;
overflow: auto;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/TEMPLATE_FONDO_RATAS_A5_400px.png");
background-repeat: no-repeat;
background-size:cover;
background-position: top;
box-sizing: border-box;
border-top: none;
}
/* Header formatting - title and subtitle */
.sheet-rolltemplate-ratascombate .sheet-header {
height: 45px;
/* change text-align to center to center the header text */
padding: 5px;
}
.sheet-rolltemplate-ratascombate .sheet-title {
font-family: "Special Elite", system-ui;
font-size: 24px;
font-weight: bold;
margin: 12px 0px 0px 0px;
text-align: center;
color: #000000;
text-transform: uppercase;
}
.sheet-rolltemplate-ratascombate .sheet-subtitle {
font-family: "Special Elite", system-ui;
font-size: 14px;
font-weight: bold;
margin: 2px 0px 0px 0px;
text-align: center;
color: #ff0000;
}
.textchatcontainer .inlinerollresult {
background-color: #fef68e;
border: 2px solid #fef68e;
padding: 3px 3px 0px 3px!important;
font-weight: bold;
cursor: help;
/* line-height: 20px; */
font-size: 1.1em;
}
/* Make even-numbered rows grey */
.sheet-rolltemplate-ratascombate .sheet-contento :nth-child(1n+3),
.sheet-rolltemplate-ratascombate .sheet-contento :nth-child(1n) {
background-color: transparent !important;
border: none!important;
}
.sheet-rolltemplate-ratascombate .textchatcontainer .inlinerollresult {
background-color: #fef68e;
border: 2px solid #fef68e;
padding: 0px 3px 0px 3px;
font-weight: bold;
cursor: help;
font-size: 1.9em!important;
}
.sheet-rolltemplate-ratascombate .sheet-filatemplate1R{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 40px;
margin: 5px 5% 0px 5%;
padding: 16px 0px 0px;
color: #ff0000!important;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 50px!important;
font-style: normal;
}
.sheet-rolltemplate-ratascombate .sheet-filatemplate1V{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 40px;
margin: 60px 5% 0px 5%;
padding: 16px 0px 0px;
color: darkgreen!important;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 50px!important;
font-style: normal;
}
.sheet-rolltemplate-ratascombate .sheet-filatemplate2{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 15px;
margin: -8px 5% 0px 5%;
padding: 0px 0px 5px 0px;
color: #000000;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 24px;
font-style: normal;
}
.sheet-rolltemplate-ratascombate .sheet-filatemplate3{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 15px;
margin: 0% 5%;
padding: 0px 0px 0px 0px;
color: #000000;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 18px;
font-style: normal;
}
.sheet-rolltemplate-ratascombate .sheet-filatemplatesang {
position: absolute;
width: 300px;
height: auto;
min-height: 200px;
margin-top: -55px;
overflow: auto;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_TEMPLATE_SANG_A3.png");
background-repeat: no-repeat;
background-size:cover;
background-position: top;
box-sizing: border-box;
border-top: none;
}
/*=================== RATAS EN LAS PAREDES HECHICERIA ROLL ROLLTEMPLATE CSS ===================*/
/* Smaller margins - remove these if you want the huge default left margin */
.sheet-rolltemplate-ratasmagia {
margin-left: -37px;
}
.sheet-rolltemplate-ratasmagia .sheet-fotofondo {
width: 300px;
height: auto;
min-height: 200px;
overflow: auto;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/TEMPLATE_FONDO_RATAS_A5_400px.png");
background-repeat: no-repeat;
background-size:cover;
background-position: top;
box-sizing: border-box;
border-top: none;
}
/* Header formatting - title and subtitle */
.sheet-rolltemplate-ratasmagia .sheet-header {
height: 45px;
/* change text-align to center to center the header text */
padding: 5px;
}
.sheet-rolltemplate-ratasmagia .sheet-title {
font-family: "Special Elite", system-ui;
font-size: 24px;
font-weight: bold;
margin: 12px 0px 0px 0px;
text-align: center;
color: #000000;
text-transform: uppercase;
}
.sheet-rolltemplate-ratasmagia .sheet-subtitle {
font-family: "Special Elite", system-ui;
font-size: 14px;
font-weight: bold;
margin: 2px 0px 0px 0px;
text-align: center;
color: #ff0000;
}
.textchatcontainer .inlinerollresult {
background-color: #fef68e;
border: 2px solid #fef68e;
padding: 3px 3px 0px 3px!important;
font-weight: bold;
cursor: help;
/* line-height: 20px; */
font-size: 1.1em;
}
/* Make even-numbered rows grey */
.sheet-rolltemplate-ratasmagia .sheet-contento :nth-child(1n+3),
.sheet-rolltemplate-ratasmagia .sheet-contento :nth-child(1n) {
background-color: transparent !important;
border: none!important;
}
.sheet-rolltemplate-ratasmagia .textchatcontainer .inlinerollresult {
background-color: #fef68e;
border: 2px solid #fef68e;
padding: 0px 3px 0px 3px;
font-weight: bold;
cursor: help;
font-size: 1.9em!important;
}
.sheet-rolltemplate-ratasmagia .sheet-filatemplate1R{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 40px;
margin: 60px 5% 0px 5%;
padding: 16px 0px 0px;
color: #ff0000!important;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 50px!important;
font-style: normal;
}
.sheet-rolltemplate-ratasmagia .sheet-filatemplate1V{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 40px;
margin: 60px 5% 0px 5%;
padding: 16px 0px 0px;
color: darkgreen!important;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 50px!important;
font-style: normal;
}
.sheet-rolltemplate-ratasmagia .sheet-filatemplate2{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 15px;
margin: -8px 5% 0px 5%;
padding: 0px 0px 5px 0px;
color: #000000;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 24px;
font-style: normal;
}
.sheet-rolltemplate-ratasmagia .sheet-filatemplate3{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 15px;
margin: 0% 5%;
padding: 0px 0px 0px 0px;
color: #000000;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 18px;
font-style: normal;
}
.sheet-rolltemplate-ratasmagia .sheet-filatemplatemagiaverde {
position: absolute;
width: 300px;
height: auto;
min-height: 200px;
margin-top: -55px;
overflow: auto;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_TEMPLATE_MAGIC_VERDE_A3.png");
background-repeat: no-repeat;
background-size:cover;
background-position: top;
box-sizing: border-box;
border-top: none;
}
.sheet-rolltemplate-ratasmagia .sheet-filatemplatemagiarojo {
position: absolute;
width: 300px;
height: auto;
min-height: 200px;
margin-top: -55px;
overflow: auto;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/RELP_TEMPLATE_MAGIC_ROJO_A3.png");
background-repeat: no-repeat;
background-size:cover;
background-position: top;
box-sizing: border-box;
border-top: none;
}
/*=================== RATAS EN LAS PAREDES ROLL ROLLTEMPLATE CSS ===================*/
/* Smaller margins - remove these if you want the huge default left margin */
.sheet-rolltemplate-ratasdados {
margin-left: -37px;
}
.sheet-rolltemplate-ratasdados .sheet-fotofondo {
width: 300px;
height: auto;
min-height: 200px;
overflow: auto;
background-image: url("https://rolmasters.com/ROLL20/RATAS_EN_LAS_PAREDES/TEMPLATE_FONDO_RATAS_A5_400px.png");
background-repeat: no-repeat;
background-size:cover;
background-position: top;
box-sizing: border-box;
border-top: none;
}
/* Header formatting - title and subtitle */
.sheet-rolltemplate-ratasdados .sheet-header {
height: 45px;
/* change text-align to center to center the header text */
padding: 5px;
}
.sheet-rolltemplate-ratasdados .sheet-title {
font-family: "Special Elite", system-ui;
font-size: 24px;
font-weight: bold;
margin: 12px 0px 0px 0px;
text-align: center;
color: #000000;
text-transform: uppercase;
}
.sheet-rolltemplate-ratasdados .sheet-subtitle {
font-family: "Special Elite", system-ui;
font-size: 14px;
font-weight: bold;
margin: 2px 0px 0px 0px;
text-align: center;
color: #ff0000;
}
.textchatcontainer .inlinerollresult {
background-color: #fef68e;
border: 2px solid #fef68e;
padding: 3px 3px 0px 3px!important;
font-weight: bold;
cursor: help;
/* line-height: 20px; */
font-size: 1.1em;
}
/* Make even-numbered rows grey */
.sheet-rolltemplate-ratasdados .sheet-contento :nth-child(1n+3),
.sheet-rolltemplate-ratasdados .sheet-contento :nth-child(1n) {
background-color: transparent !important;
border: none!important;
}
.sheet-rolltemplate-ratasdados .textchatcontainer .inlinerollresult {
background-color: #fef68e;
border: 2px solid #fef68e;
padding: 0px 3px 0px 3px;
font-weight: bold;
cursor: help;
font-size: 1.9em!important;
}
.sheet-rolltemplate-ratasdados .sheet-filatemplatedados{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 40px;
margin: 20px 5% 0px 5%;
padding: 8px 0px 0px;
color: #000000!important;
text-align:center;
font-family: "Uchen", serif;
font-weight: 400;
font-size: 60px!important;
font-style: normal;
}
.sheet-rolltemplate-ratasdados .sheet-filatemplate2{
position:relative;
float:left;
width:90%;
height:auto;
min-height: 15px;
margin: 0px 5% 0px 5%;
padding: 0px 0px 5px 0px;
color: #000000!important;
text-align:center;
font-family: "Uchen", serif;
font-weight: bold;
font-size: 24px;
font-style: normal;
}