Files
roll20-character-sheets/3DX/3dx.css
T
ap.gabriel.p e95cd5e503 Remove some unecessary inputs and info from rolltemplates. Rework some styles that were unresponsive.
Removed an unnecessary textarea and some inputs that were being useless and cleaned cluttered information on abilities rolltemplates. Fixed some css styles that weren't responsive and often broke the sheet depending on the size of the window.
2025-08-09 10:54:43 -03:00

1563 lines
35 KiB
CSS

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap');
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, button, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: none;
font: inherit;
text-decoration: none;
vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a {
color: inherit;
}
textarea {
resize: none;
}
.characterviewer label {
font-weight: 600;
font-size: 12px;
margin-bottom: 0;
}
.largedialog label {
padding-right: 0rem;
text-align: center;
}
.largedialog textarea {
height: 100%;
padding-inline: 0.3rem;
width: calc(100% - 0.6rem);
}
.ui-dialog .charsheet input {
height: 100%;
}
.ui-dialog .charsheet {
padding: 0px;
}
input, textarea, select, .uneditable-input {
border-radius: 0px;
height: 100%;
line-height: 1;
margin-bottom: 0px;
padding: 0px;
width: 100%;
-webkit-border-radius: 0px;
}
label, input, button, select, textarea {
line-height: 1;
}
.ui-dialog .charsheet button[type="roll"], .ui-dialog .charsheet button[type="compendium"] {
align-items: center;
display: flex;
font-size: 1.1rem;
height: 100%;
}
.ui-dialog .charsheet button[type="roll"]:before {
color: #686868;
font-family: "Pictos";
font-size: 1rem;
content: "y";
}
.btn, .btn.btn-default {
box-shadow: none;
-webkit-box-shadow: none;
text-shadow: none;
}
.Tab__Display {
display: none;
}
.Radio__Personagem:checked ~ .Tab__Personagem, .Radio__Habilidades:checked ~ .Tab__Habilidades {
display: block;
}
.Root {
--background: #181818;
--backgroundbutton: #111111;
--boxbg: #383838;
--boxborder: #383838;
--fonttitle: #D0D0D0;
--fontsub: #a0a0a0;
--tabbgactive: #d8d8d8;
--tabtext: #050505;
--diceroll: #DCDCDC;
background: var(--background);
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.Hidden {
opacity: 0% !important;
}
.OpenSans {
color: var(--fonttitle);
font-family: "Open Sans";
font-size: 12px;
font-weight: 500;
letter-spacing: 0;
line-height: 0.9rem;
text-align: center;
}
#subtitle {
font-size: 0.55rem;
}
.charsheet .Tab__Display {
width: 100%;
}
.charsheet .Radio__Personagem, .charsheet .Radio__Habilidades {
display: none;
}
.charsheet .TabLabel__Personagem, .charsheet .TabLabel__Habilidades {
background-color: var(--boxborder);
border: solid thin var(--boxborder);
border-radius: 5px;
font-family: "Open Sans";
margin-top: 1.5rem;
padding-block: 0.3rem;
padding-inline: 1.25rem;
transition: 0.1s;
width: 5rem;
}
.charsheet .TabLabel__Personagem {
margin-right: 0.5rem;
}
.charsheet .TabLabel__Personagem:hover, .charsheet .TabLabel__Habilidades:hover {
filter: brightness(135%);
font-family: "Open Sans";
}
.charsheet input[type="radio"]:checked+label {
background-color: var(--tabbgactive);
color: var(--tabtext);
font-family: "Open Sans";
}
.charsheet input[type="radio"]:not(:checked)+label {
color: #A9A9A9;
}
.charsheet .Iniciativa__Box {
align-items: center;
display: flex;
justify-content: center;
margin-left: calc(0.5rem - 6px);
margin-top: 1.5rem;
}
.Header {
display: flex;
justify-content: space-between;
margin-bottom: 1.5rem;
padding-inline: 2%;
width: 96%;
}
.Nivel_P__Section {
display: flex;
width: 14%;
}
.Nivel_P__Box {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-radius: 10px 10px 10px 10px;
flex-direction: column;
justify-content: center;
width: 7.5%;
}
.Nivel_P__Label {
background: var(--boxbg);
border-radius: 7px 7px 0px 0px;
padding-block: 0.3rem;
width: 100%;
}
.Nivel_P__Input {
background: none;
border: none;
padding-block: 0.3rem;
width: 100%;
}
.Column__Triple {
display: flex;
flex-direction: column;
width: 29.5%;
}
.Column__Double {
display: flex;
flex-direction: column;
width: 50%;
}
.Personagem__Box {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-radius: 10px;
flex-direction: column;
justify-content: center;
width: 100%;
}
.Personagem__Label {
background: var(--boxbg);
border-radius: 7px 7px 0 0;
padding-block: 0.3rem;
width: 100%;
}
.Personagem__Input {
background: none;
border: none;
padding-block: 0.3rem;
width: 100%;
}
.Informacao__Wrap {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-radius: 10px;
justify-content: center;
width: 100%;
}
.Informacao__Box {
display: flex;
flex-direction: column;
width: 100%;
}
.Informacao__Label {
background: var(--boxbg);
padding-block: 0.3rem;
width: 100%;
}
.Informacao__Input {
background: none;
border: none;
padding-block: 0.3rem;
}
.Left__Label {
border-radius: 7px 0 0 0;
}
.Right__Label {
border-radius: 0 7px 0 0;
}
.Middle__Input {
border-left: solid thin var(--boxborder);
border-right: solid thin var(--boxborder)
}
.Jogador__Box {
display: flex;
border: solid thin var(--boxborder);
border-radius: 10px;
flex-direction: column;
width: 25%;
}
.Jogador__Label {
background: var(--boxbg);
border-radius: 7px 7px 0 0;
padding-block: 0.3rem;
width: 100%;
}
.Jogador__Input {
background: none;
border: none;
padding-block: 0.3rem;
width: 100%;
}
.Description {
display: flex;
justify-content: space-between;
margin-bottom: 1.5rem;
padding-inline: 2%;
width: 96%;
}
.Column__Double:first-child {
padding-right: 1.5rem;
}
.DescriptionL__Box {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-bottom: none;
flex-direction: column;
justify-content: flex-start;
width: 100%;
}
.DescriptionL__Label {
background: var(--boxbg);
padding-block: 0.3rem;
width: 100%;
}
.DescriptionL__Textarea {
background: none;
border: none;
padding-block: 0.3rem;
text-align: start;
width: 100%;
}
.DescriptionL__Correction_Padding {
padding-bottom: 0.84rem;
}
.DescriptionR__Box {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-bottom: none;
flex-direction: column;
justify-content: flex-start;
width: calc(100% - 2px);
}
.DescriptionR__Label {
background: var(--boxbg);
padding-block: 0.3rem;
width: 100%;
}
.DescriptionR__Textarea {
background: none;
border: none;
padding-block: 0.3rem;
text-align: start;
width: 100%;
}
.First__Box {
border-radius: 10px 10px 0 0;
}
.Last__Box {
border-bottom: solid thin var(--boxborder);
border-radius: 0 0 10px 10px;
}
.First__Label {
border-radius: 7px 7px 0 0;
}
.Origem__Wrap {
display: flex;
}
.Origem__Box {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-bottom: none;
flex-direction: column;
justify-content: flex-start;
width: 100%;
}
.Origem__Label {
background: var(--boxbg);
padding-block: 0.3rem;
width: 100%;
}
.Origem__Textarea {
background: none;
border: none;
padding-block: 0.3rem;
text-align: start;
width: 100%;
}
.Origem__Box--Left {
border-radius: 10px 0 0 0;
border-right: none;
}
.Origem__Box--Right {
border-radius: 0 10px 0 0;
border-left: none;
}
.Origem__Textarea--Left {
border-right: solid thin var(--boxborder);
}
.Origem__Textarea--Right {
width: calc(100% - 12px);
}
.Origem__Label--Left {
border-radius: 7px 0 0 0;
}
.Origem__Label--Right {
border-radius: 0 7px 0 0;
}
.Resize {
height: 100%;
}
.Gameplay {
display: flex;
padding-bottom: 1.5rem;
padding-inline: 2%;
width: 96%;
}
.Gameplay__Wrap {
display: flex;
flex-direction: column;
width: 100%
}
.GameplayUpper__Wrap {
display: flex;
justify-content: space-between;
margin-bottom: 1.5rem;
}
.GameplayUpper__Wrap--Left {
display: flex;
border-top: solid thin var(--boxborder);
border-radius: 10px;
flex-direction: column;
width: 34%;
}
.Status__Wrap {
border-left: solid thin var(--boxborder);
border-right: solid thin var(--boxborder);
border-radius: 10px 10px 0 0;
display: flex;
}
.Status__Box {
display: flex;
flex-direction: column;
width: 50%;
}
.Status__Label {
background: var(--boxbg);
padding-block: 0.3rem;
}
.StatusDesc__Wrap {
display: flex;
border-right: solid thin var(--boxborder);
width: 100%;
}
.Status__Description {
align-items: center;
color: var(--fontsub);
display: flex;
font-size: 0.7rem;
justify-content: center;
padding-block: 0.5rem;
}
.Status__Input {
background: none;
border: none;
font-size: 14px;
padding-block: 0.5rem;
}
.Status__Box--Left {
border-right: solid thin var(--boxborder);
}
.RD__Resize--Width {
width: 20%;
}
.Complicacoes__Box {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-radius: 0 0 10px 10px;
flex-direction: column;
justify-content: center;
width: calc(100% - 2px);
}
.Complicacoes__Label {
background: var(--boxbg);
padding-block: 0.3rem;
width: 100%;
}
.Complicacoes__Textarea {
background: none;
border: none;
height: 100%;
padding-block: 0.3rem;
text-align: start;
width: calc(100% - 4px);
}
.Proficiencias__Especiais--Wrap {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 12%;
}
.Proficiencias__Especiais--Box {
align-items: center;
display: flex;
margin-block: 0.5rem;
margin-right: 0.1rem;
}
.Proficiencias__Especiais--Text {
font-size: 12px !important;
}
.Deslocamento__Box {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-radius: 10px;
flex-direction: column;
justify-content: center;
width: 100%;
}
.Deslocamento__Label {
background: var(--boxbg);
border-radius: 7px 7px 0 0;
padding-block: 0.3rem;
width: 100%;
}
.Deslocamento__Input {
background: none;
border: none;
font-size: 14px;
padding-block: 0.5rem;
}
.Armas__Wrap {
display: flex;
border: solid thin var(--boxborder);
border-radius: 10px;;
flex-direction: column;
width: 48%;
}
.Armas__Label {
background: var(--boxbg);
border-radius: 7px 7px 0 0;
padding-block: 0.3rem;
width: 100%;
}
.Armas__Section {
display: flex;
flex-direction: column;
margin-bottom: 0.5rem;
padding-left: 0.25rem;
width: calc(100% - 1rem);
}
.Armas__Row {
display: flex;
height: 1.1rem !important;
justify-content: space-between;
margin-bottom: 0.2rem;
width: 100%;
}
.Armas__Row--First{
margin-top: 0.4rem;
}
.Armas__Nome--First, .Armas__Dano--First {
background-color: transparent !important;
border: none !important;
color: #a0a0a0 !important;
font-size: 0.55rem;
}
.Armas__Coluna {
align-items: center;
display: flex;
flex-direction: column;
justify-content: space-between;
width: 100%;
}
.ArmasBotao {
width: 4% !important;
}
.ArmasNome {
width: 38% !important;
}
.ArmasDano {
width: 15% !important;
}
.Armas__Description {
align-items: center;
color: var(--fontsub);
display: flex;
font-size: 0.7rem;
justify-content: center;
padding-block: 0.5rem;
}
.Armas__Button:first-child {
margin-top: 1.7rem;
}
.Armas__Input {
background: none;
border: none;
border-bottom: solid thin var(--boxborder);
display: flex;
padding-block: 0.2rem;
}
.Armas__Button {
align-content: center;
border: none;
display: flex;
justify-content: center;
padding-bottom: 0.2rem;
height: 100%;
width: 1rem;
}
.GameplayLower__Wrap {
display: flex;
}
.Proficiencias__Box {
align-items: center;
border: solid thin var(--boxborder);
border-radius: 10px;
display: flex;
flex-direction: column;
width: 65%;
}
.Proficiencias__Title {
background: var(--boxbg);
border-radius: 7px 7px 0 0;
padding-block: 0.3rem;
width: 100%;
}
.ProficienciasColumns__Wrap {
display: flex;
height: 95%;
width: 95%;
}
.Proficiencias__Wrap__L {
display: flex;
flex-direction: column;
width: 50%;
margin-bottom: 0.6rem
}
.Proficiencias__Wrap__R {
display: flex;
flex-direction: column;
margin-bottom: 0.6rem;
width: 50%;
}
.Proficiencias__Wrap__Especial {
display: flex;
justify-content: space-evenly;
padding-block: calc(0.7rem - 2px);
padding-left: -3px;
width: 100%;
}
.Proficiencias__Wrap_Column {
display: flex;
flex-direction: row;
height: 100%;
width: 100%;
}
.Proficiencias__Column {
align-items: center;
display: flex;
flex-direction: column;
margin-right: 0.5rem;
width: 100%;
}
.Proficiencias__Column--Right {
margin-right: 0.4rem;
}
.Proficiencias__Wrap--Row {
display: flex;
margin-bottom: 0.2rem;
width: 100%;
}
.Proficiencias__First--Row {
margin-top: 0.4rem;
}
.Proficiencias__Label {
align-items: center;
color: var(--fontsub);
display: flex;
font-size: 0.7rem;
justify-content: center;
padding-block: 0.7rem;
width: 100%;
}
.Proficiencias__Especial {
width: 100%;
}
.ProficienciasBotao {
width: 5%;
}
.ProficienciasNivel {
width: 20%;
}
.ProficienciasNome {
width: 75%;
}
.ProficienciasNivel__First, .ProficienciasNome__First {
background-color: transparent !important;
border: none !important;
color: #a0a0a0 !important;
font-size: 0.55rem;
text-align: center !important;
}
.Proficiencias__Input--Nivel, .Proficiencias__Input--Nome {
background: none;
border: none;
border-bottom: solid thin var(--boxborder);
}
.Proficiencias__Input--Nivel {
margin-right: 0.5rem;
width: 20%;
}
.Proficiencias__Input--Nome {
padding-left: 0.25rem;
width: calc(80% - 0.5rem);
}
.Proficiencias__Button {
align-content: center;
border: none;
display: flex;
justify-content: center;
padding-bottom: 0.2rem;
height: 100%;
width: 1rem;
}
.Inventory__Wrap {
align-items: center;
display: flex;
flex-direction: column;
padding-inline: 2.5%;
width: 30%;
}
.Inventory__Box {
align-items: center;
border: solid thin var(--boxborder);
border-bottom: none;
display: flex;
flex-direction: column;
padding-bottom: 0.27rem;
width: 100%;
}
.Inventory__Box--Last {
border-bottom: solid thin var(--boxborder);
border-radius: 0px 0px 10px 10px;
}
.Inventory__Label {
background: var(--boxbg);
border-radius: 7px 7px 0 0;
padding-block: 0.3rem;
width: 100%;
}
.Inventory__Textarea {
background: none;
border: none;
padding-bottom: 0.5rem;
padding-top: 0.3rem;
text-align: start;
width: 100%;
}
.Square__Label {
border-radius: 0;
}
.Bottom__Line {
border-bottom: solid thin var(--boxborder);
}
.Resource__Wrap {
display: flex;
justify-content: center;
margin-bottom: 0.5rem;
width: 90%;
}
.Resource__Column {
align-items: center;
display: flex;
flex-direction: column;
}
.Resource__Label {
align-items: center;
color: var(--fontsub);
display: flex;
font-size: 0.7rem;
justify-content: center;
padding-block: 0.7rem;
width: 100%;
}
.Resource__Input {
background: none;
border: none;
border-bottom: solid thin var(--boxborder);
display: flex;
padding-block: 0.2rem;
width: calc(100% - 1px);
}
.Resource__Button {
align-content: center;
border: none;
display: flex;
justify-content: center;
padding-bottom: 0.2rem;
height: 100%;
width: 1rem;
}
.ResourceButton {
width: 5%;
}
.ResourceNome {
margin-left: 1.0rem;
margin-right: 0.5rem;
width: calc(75% - 1.5rem);
}
.ResourceQuant {
width: 20%;
}
.QuantInner__Column {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 100%;
width: 100%;
}
.Habilidades__Section {
display: flex;
flex-direction: column;
width: 30%;
}
.Habilidades__Box {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-radius: 10px;
flex-direction: column;
justify-content: flex-start;
width: 100%
}
.Habilidades__Label {
background: var(--boxbg);
border-radius: 7px 7px 0px 0px;
padding-block: 0.3rem;
width: 100%;
}
.Habilidades__Input {
background: none;
border: none;
padding-bottom: 0.46rem;
padding-top: 0.3rem;
width: 100%;
}
.Beneficios__Box {
align-items: center;
display: flex;
border: solid thin var(--boxborder);
border-radius: 0px 0px 10px 10px;
flex-direction: column;
height: 100%;
justify-content: flex-start;
width: 100%
}
.Beneficios__Label {
background: var(--boxbg);
padding-block: 0.3rem;
width: 100%;
}
.Beneficios__Input {
background: none;
border: none;
padding-block: 0.3rem;
width: 100%;
}
.LeftAlign {
text-align: left;
}
#suminput {
background-color: transparent;
border: none;
font-family: "Open Sans";
font-weight: 600;
padding-bottom: 0.4rem;
padding-left: 0.3rem;
text-align: left;
}
.Rolagens__Wrap {
align-items: center;
display: flex;
justify-content: center;
margin-block: 1.5rem;
width: 100%;
}
.Rolagens__Box {
align-items: center;
display: flex;
justify-content: center;
}
.Rolagens__Box--Generica {
margin-left: 0.75rem;
}
.Rolagens__Button {
margin-right: 0.5rem;
}
.Rolagens__Label {
font-size: 1.5rem;
}
.Rolagens__Input {
background: none;
border: none;
border-bottom: solid thin var(--boxborder);
display: flex;
width: 4rem;
}
.charsheet .Tab__Habilidades {
padding-inline: 2%;
}
.charsheet .HabilidadesCard__Aviso{
padding-bottom: 1.5rem;
}
.charsheet .HabilidadesCard__Column {
align-items: center;
display: flex;
justify-content: space-between;
margin-bottom: 1.5rem;
}
.charsheet .HabilidadesCard__Div {
align-items: center;
border: solid thin var(--boxborder);
border-radius: 10px;
display: flex;
flex-direction: column;
justify-content: center;
width: 48.5%;
}
.charsheet .HabilidadesCard__Button {
background: none;
border: none;
}
.charsheet .HabilidadesCard__Button--Text {
color: var(--fontsub);
margin-left: 0.3rem;
}
.charsheet .HabilidadesCard__Button:hover {
background: var(--tabbgactive);
}
.charsheet .HabilidadesCard__Nome {
background: var(--boxbg);
border: none;
border-radius: 7px 7px 0px 0px;
margin-bottom: 0.5rem;
padding-block: 0.3rem;
}
.charsheet .HabilidadesCard__Wrapper {
display: flex;
flex-direction: column;
padding-block: 0.3rem;
width: 100%;
}
.charsheet .HabilidadesCard__Atributo {
display: flex;
padding-block: 0.2rem;
width: 100%;
}
.charsheet .HabilidadesCard__Label {
text-align: left;
margin-left: 3%;
padding-block: 0.3rem;
width: 22%;
}
.charsheet .HabilidadesCard__Input {
background: var(--boxbg);
border: none;
border-radius: 5px;
box-sizing: border-box;
margin-right: 3%;
padding-inline: 0.3rem;
padding-block: 0.3rem;
text-align: left;
width: 75%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
.charsheet .HabilidadesCard__Input2 {
background: var(--boxbg);
border: none;
border-radius: 5px;
box-sizing: border-box;
margin-right: 4%;
padding-inline: 0.3rem;
padding-block: 0.3rem;
text-align: left;
width: 25%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
.charsheet .HabilidadesCard__InputWrapper {
display: flex;
width: 78%
}
.sheet-rolltemplate-3dxdano {
padding-block: 1rem;
}
.sheet-rolltemplate-3dxdano div.sheet-roll-container {
align-items: center;
background: #181818;
border-radius: 10px;
border: 0.2rem solid #484848;
display: flex;
flex-direction: column;
width: 100%;
}
.sheet-rolltemplate-3dxdano div.sheet-roll-container span.sheet-roll-namepdj {
background: #383838;
border-radius: 7px 7px 0px 0px;
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.4rem;
font-weight: 600;
line-height: 100%;
padding-block: 0.6rem;
text-align: center;
width: 100%;
}
.sheet-rolltemplate-3dxdano div.sheet-roll-container div.sheet-roll-wrap {
align-items: center;
display: flex;
justify-content: center;
padding-top: 1.9rem;
padding-bottom: 1.55rem;
width: 100%;
}
.sheet-rolltemplate-3dxdano div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-dano {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
font-weight: 600;
margin-right: 0.75rem;
}
.sheet-rolltemplate-3dxdano div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-macroresult span {
background-color: #E8E8E8;
border: none;
border-radius: 4px;
color: #000000;
font-family: "Open Sans";
font-size: 1.8rem;
font-weight: 500;
padding-block: 0.1rem;
padding-inline: 0.5rem;
}
.sheet-rolltemplate-3dxdano div.sheet-roll-container div.sheet-roll-wrapaction {
align-items: center;
border-top: 0.1rem solid #383838;
display: flex;
justify-content: center;
padding-top: 0.5rem;
padding-bottom: 0.6rem;
width: 100%;
}
.sheet-rolltemplate-3dxdano div.sheet-roll-container div.sheet-roll-wrapaction span.sheet-roll-actionname {
color: #A9A9A9;
font-family: "Open Sans";
font-size: 1.2rem;
font-weight: 600;
margin-right: 0.4rem;
}
.sheet-rolltemplate-3dxdano div.sheet-roll-container div.sheet-roll-wrapaction span.sheet-roll-dicename {
color: #A9A9A9;
font-family: "Open Sans";
font-size: 1.2rem;
font-weight: 600;
}
.sheet-rolltemplate-3dxproficiencia {
padding-block: 1rem;
}
.sheet-rolltemplate-3dxproficiencia div.sheet-roll-container {
align-items: center;
background: #181818;
border-radius: 10px;
border: 0.2rem solid #484848;
display: flex;
flex-direction: column;
width: 100%;
}
.sheet-rolltemplate-3dxproficiencia div.sheet-roll-container span.sheet-roll-namepdj {
background: #383838;
border-radius: 7px 7px 0px 0px;
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.4rem;
font-weight: 600;
line-height: 100%;
padding-block: 0.6rem;
text-align: center;
width: 100%;
}
.sheet-rolltemplate-3dxproficiencia div.sheet-roll-container div.sheet-roll-wrap {
align-items: center;
display: flex;
justify-content: center;
padding-top: 1.9rem;
padding-bottom: 1.55rem;
width: 100%;
}
.sheet-rolltemplate-3dxproficiencia div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-proficiencia {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
font-weight: 600;
margin-right: 0.75rem;
}
.sheet-rolltemplate-3dxproficiencia div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-macroresult span {
background-color: #E8E8E8;
border: none;
border-radius: 4px;
color: #000000;
font-family: "Open Sans";
font-size: 1.8rem;
font-weight: 500;
padding-block: 0.1rem;
padding-inline: 0.5rem;
}
.sheet-rolltemplate-3dxproficiencia div.sheet-roll-container div.sheet-roll-wrapaction {
align-items: center;
border-top: 0.1rem solid #383838;
display: flex;
justify-content: center;
padding-top: 0.5rem;
padding-bottom: 0.6rem;
width: 100%;
}
.sheet-rolltemplate-3dxproficiencia div.sheet-roll-container div.sheet-roll-wrapaction span.sheet-roll-actionname {
color: #A9A9A9;
font-family: "Open Sans";
font-size: 1.2rem;
font-weight: 600;
margin-right: 0.4rem;
}
.sheet-rolltemplate-3dxproficiencia div.sheet-roll-container div.sheet-roll-wrapaction span.sheet-roll-levelname {
color: #A9A9A9;
font-family: "Open Sans";
font-size: 1.2rem;
font-weight: 600;
}
.sheet-rolltemplate-3dxrecurso {
padding-block: 1rem;
}
.sheet-rolltemplate-3dxrecurso div.sheet-roll-container {
align-items: center;
background: #181818;
border-radius: 10px;
border: 0.2rem solid #484848;
display: flex;
flex-direction: column;
width: 100%;
}
.sheet-rolltemplate-3dxrecurso div.sheet-roll-container span.sheet-roll-namepdj {
background: #383838;
border-radius: 7px 7px 0px 0px;
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.4rem;
font-weight: 600;
line-height: 100%;
padding-block: 0.6rem;
text-align: center;
width: 100%;
}
.sheet-rolltemplate-3dxrecurso div.sheet-roll-container div.sheet-roll-wrap {
align-items: center;
display: flex;
justify-content: center;
padding-top: 1.9rem;
padding-bottom: 1.55rem;
width: 100%;
}
.sheet-rolltemplate-3dxrecurso div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-recurso {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
font-weight: 600;
margin-right: 0.75rem;
}
.sheet-rolltemplate-3dxrecurso div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-macroresult span {
background-color: #E8E8E8;
border: none;
border-radius: 4px;
color: #000000;
font-family: "Open Sans";
font-size: 1.8rem;
font-weight: 500;
padding-block: 0.1rem;
padding-inline: 0.5rem;
}
.sheet-rolltemplate-3dxrecurso div.sheet-roll-container div.sheet-roll-wrapaction {
align-items: center;
border-top: 0.1rem solid #383838;
display: flex;
justify-content: center;
padding-top: 0.5rem;
padding-bottom: 0.6rem;
width: 100%;
}
.sheet-rolltemplate-3dxrecurso div.sheet-roll-container div.sheet-roll-wrapaction span.sheet-roll-actionname {
color: #A9A9A9;
font-family: "Open Sans";
font-size: 1.2rem;
font-weight: 600;
margin-right: 0.4rem;
}
.sheet-rolltemplate-3dxrecurso div.sheet-roll-container div.sheet-roll-wrapaction span.sheet-roll-namequant {
color: #A9A9A9;
font-family: "Open Sans";
font-size: 1.2rem;
font-weight: 600;
}
.sheet-rolltemplate-3dxiniciativa {
padding-block: 1rem;
}
.sheet-rolltemplate-3dxiniciativa div.sheet-roll-container {
align-items: center;
background: #181818;
border-radius: 10px;
border: 0.2rem solid #484848;
display: flex;
flex-direction: column;
width: 100%;
}
.sheet-rolltemplate-3dxiniciativa div.sheet-roll-container span.sheet-roll-namepdj {
background: #383838;
border-radius: 7px 7px 0px 0px;
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.4rem;
font-weight: 600;
line-height: 100%;
padding-block: 0.6rem;
text-align: center;
width: 100%;
}
.sheet-rolltemplate-3dxiniciativa div.sheet-roll-container div.sheet-roll-wrap {
align-items: center;
display: flex;
justify-content: center;
padding-top: 1.9rem;
padding-bottom: 1.55rem;
width: 100%;
}
.sheet-rolltemplate-3dxiniciativa div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-iniciativa {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
font-weight: 600;
margin-right: 0.75rem;
}
.sheet-rolltemplate-3dxiniciativa div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-macroresult span {
background-color: #E8E8E8;
border: none;
border-radius: 4px;
color: #000000;
font-family: "Open Sans";
font-size: 1.8rem;
font-weight: 500;
padding-block: 0.1rem;
padding-inline: 0.5rem;
}
.sheet-rolltemplate-3dxgenerico {
padding-block: 1rem;
}
.sheet-rolltemplate-3dxgenerico div.sheet-roll-container {
align-items: center;
background: #181818;
border-radius: 10px;
border: 0.2rem solid #484848;
display: flex;
flex-direction: column;
width: 100%;
}
.sheet-rolltemplate-3dxgenerico div.sheet-roll-container span.sheet-roll-namepdj {
background: #383838;
border-radius: 7px 7px 0px 0px;
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.4rem;
font-weight: 600;
line-height: 100%;
padding-block: 0.6rem;
text-align: center;
width: 100%;
}
.sheet-rolltemplate-3dxgenerico div.sheet-roll-container div.sheet-roll-wrap {
align-items: center;
display: flex;
justify-content: center;
padding-top: 1.9rem;
padding-bottom: 1.55rem;
width: 100%;
}
.sheet-rolltemplate-3dxgenerico div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-generico {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
font-weight: 600;
margin-right: 0.75rem;
}
.sheet-rolltemplate-3dxgenerico div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-macroresult span {
background-color: #E8E8E8;
border: none;
border-radius: 4px;
color: #000000;
font-family: "Open Sans";
font-size: 1.8rem;
font-weight: 500;
padding-block: 0.1rem;
padding-inline: 0.5rem;
}
.sheet-rolltemplate-3dxhabilidade {
padding-block: 1rem;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container {
align-items: center;
background: #181818;
border-radius: 10px 10px 0px 0px;
border: 0.2rem solid #484848;
display: flex;
flex-direction: column;
width: 100%;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container span.sheet-roll-namepdj {
background: #383838;
border-radius: 7px 7px 0px 0px;
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.4rem;
font-weight: 600;
line-height: 100%;
padding-block: 0.6rem;
text-align: center;
width: 100%;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container div.sheet-roll-wrap {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
width: 100%;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container div.sheet-roll-attribute {
align-items: center;
display: flex;
padding-block: 0.5rem;
padding-inline: 1rem;
width: calc(100% - 2rem);
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container div.sheet-roll-attribute-first {
background: #181818;
border-bottom: 0.1rem solid #484848;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container div.sheet-roll-attribute-second {
background: #181818;
border-bottom: 0.1rem solid #484848;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container div.sheet-roll-attribute span.sheet-roll-desc {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
font-weight: 600;
text-align: left;
width: 15rem;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container div.sheet-roll-attribute span.sheet-roll-value {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
padding-left: 1.5rem;
text-align: left;
width: 100%;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container div.sheet-roll-attribute div.sheet-roll-value-wrapper {
font-family: "Open Sans";
padding-left: 1.3rem;
width: 100%;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container div.sheet-roll-attribute span.sheet-roll-value-nome {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
font-weight: 500;
padding-right: 0.2rem;
padding-left: 0.4rem;
text-align: left;
width: calc(100% - 10rem);
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container div.sheet-roll-attribute .sheet-roll-value-roll span {
background-color: #E8E8E8;
border: none;
border-radius: 3.5px;
color: #000000;
font-family: "Open Sans";
font-size: 13.5px;
font-weight: 600;
padding-inline: 0.5rem;
}
.sheet-rolltemplate-3dxhabilidade div.sheet-roll-container span.sheet-roll-imagem {
align-items: center;
background-color: #181818;
padding-block: 0.5rem;
display: flex;
justify-content: center;
width: 100%;
}
.repcontrol {
margin-bottom: 1.5rem;
}
.sheet-rolltemplate-3dxsorte {
padding-block: 1rem;
}
.sheet-rolltemplate-3dxsorte div.sheet-roll-container {
align-items: center;
background: #181818;
border-radius: 10px;
border: 0.2rem solid #484848;
display: flex;
flex-direction: column;
width: 100%;
}
.sheet-rolltemplate-3dxsorte div.sheet-roll-container span.sheet-roll-namepdj {
background: #383838;
border-radius: 7px 7px 0px 0px;
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.4rem;
font-weight: 600;
line-height: 100%;
padding-block: 0.6rem;
text-align: center;
width: 100%;
}
.sheet-rolltemplate-3dxsorte div.sheet-roll-container div.sheet-roll-wrap {
align-items: center;
display: flex;
justify-content: center;
padding-top: 1.9rem;
padding-bottom: 1.55rem;
width: 100%;
}
.sheet-rolltemplate-3dxsorte div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-sorte {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
font-weight: 600;
margin-right: 0.75rem;
}
.sheet-rolltemplate-3dxsorte div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-macroresult span {
background-color: #E8E8E8;
border: none;
border-radius: 4px;
color: #000000;
font-family: "Open Sans";
font-size: 1.8rem;
font-weight: 500;
padding-block: 0.1rem;
padding-inline: 0.5rem;
}
.sheet-rolltemplate-3dxesquiva {
padding-block: 1rem;
}
.sheet-rolltemplate-3dxesquiva div.sheet-roll-container {
align-items: center;
background: #181818;
border-radius: 10px;
border: 0.2rem solid #484848;
display: flex;
flex-direction: column;
width: 100%;
}
.sheet-rolltemplate-3dxesquiva div.sheet-roll-container span.sheet-roll-namepdj {
background: #383838;
border-radius: 7px 7px 0px 0px;
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.4rem;
font-weight: 600;
line-height: 100%;
padding-block: 0.6rem;
text-align: center;
width: 100%;
}
.sheet-rolltemplate-3dxesquiva div.sheet-roll-container div.sheet-roll-wrap {
align-items: center;
display: flex;
justify-content: center;
padding-top: 1.9rem;
padding-bottom: 1.55rem;
width: 100%;
}
.sheet-rolltemplate-3dxesquiva div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-esquiva {
color: #D0D0D0;
font-family: "Open Sans";
font-size: 1.3rem;
font-weight: 600;
margin-right: 0.75rem;
}
.sheet-rolltemplate-3dxesquiva div.sheet-roll-container div.sheet-roll-wrap span.sheet-roll-macroresult span {
background-color: #E8E8E8;
border: none;
border-radius: 4px;
color: #000000;
font-family: "Open Sans";
font-size: 1.8rem;
font-weight: 500;
padding-block: 0.1rem;
padding-inline: 0.5rem;
}