roll20-character-sheets/Ludosystem/ls-style.css

@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@400;700&display=swap');

img {
  width: 300px;
}

span {
  font-size: 0.850em;
  margin-top: -15px;
  color: #BABABA;

}

input {
  font-size: 1.15em;
}

.sheet-main {
  width: 920px;
  display: grid;
  font-family: 'Heebo', sans-serif;
  color: #231f20;
  background: #f1f1f1;
}

.sheet-section {
  border: 3px solid #231f20;
  padding: 10px;
}

.sheet-info {
  display: flex;
  margin: 0 auto;
  justify-content: center;
  width: 800px;
}

.sheet-info label {
  padding: 5px;
  width: 300px;
  font-weight: bold;
  background: #231f20;
  color: #f1f1f1;
}

.sheet-info input {
  border: 3px solid #231f20;
  width: 250px;
  height: 30px;
}

.sheet-aspec-pontos {
  display: flex;
  justify-content: space-between;
  width: 900px;
}

.sheet-aspectos {
  width: 400px;
}

.sheet-aspectos h2 {
  background: #231f20;
  color: #f1f1f1;
  text-align: center;
}

.sheet-aspecto-box label {
  display: flex;
  padding: 5px;
  width: 390px;
  font-weight: bold;
  background: #231f20;
  color: #f1f1f1;
}

.sheet-aspectos input {
  width: 390px;
  height: 30px;
  border: solid 3px #231f20;
  margin-bottom: 17px;
}

.sheet-pontos {
  width: 400px;
}

.sheet-ludico {
  display: block;

  justify-content: space-between;
  align-items: flex-start;
}

.sheet-ludico h2 {
  background: #231f20;
  color: #f1f1f1;
  text-align: center;
}

.sheet-ludico label {
  padding: 10px;
  font-weight: bold;
  background: #231f20;
  color: #f1f1f1;
  width: 200px;
  height: 68px;
}

.sheet-ludico input {
  width: 100px;
  height: 100%;
  font-size: 3em;
  text-align: center;
  border: solid 3px #231f20;
}

.sheet-box {
  display: flex;
  justify-content: space-between;
}

.sheet-saude {
  display: block;
  text-align: center;
  justify-content: space-between;
  align-items: flex-start;
}

.sheet-saude h2 {
  background: #231f20;
  color: #f1f1f1;
}

.sheet-saude label {
  padding: 10px;
  font-weight: bold;
  background: #231f20;
  color: #f1f1f1;
  width: 200px;
  height: 100%;
}

.sheet-saude input {
  width: 100px;
  height: 100%;
  font-size: 3em;
  text-align: center;
  border: solid 3px #231f20;
}

.sheet-energia {
  display: block;
  text-align: center;
  justify-content: space-between;
  align-items: flex-start;
}

.sheet-energia h2 {
  background: #231f20;
  color: #f1f1f1;
}

.sheet-energia label {
  padding: 10px;
  font-weight: bold;
  background: #231f20;
  color: #f1f1f1;
  width: 200px;
  height: 68px;
}

.sheet-energia input {
  width: 100px;
  height: 100%;
  font-size: 3em;
  text-align: center;
  border: solid 3px #231f20;
}

.sheet-atributo {
  background: #231f20;
  width: 900px;
}

.sheet-atributo h2 {
  background: #231f20;
  color: #f1f1f1;
  text-align: center;
  padding: 4px;
}

.sheet-atributos-valor {
  display: flex;
  justify-content: space-around;
}


.sheet-atrbox label{
  display: block;
  padding: 10px;
  font-weight: bold;
  background: #231f20;
  color: #f1f1f1;
  width: 80px;
  text-align: center;
  margin-bottom: -30px;
}

.sheet-atrbox input{
  height: 100%;
}


.sheet-dtype {
  width: 100px;
  border: 3px solid #231f20;
  font-size: 2em;
}

.sheet-hab-fac {
  width: 900px;
}

.sheet-atrbox-hab input {
  height: 100%;
}

.sheet-hab-fac h2 {
  text-align: center;
  background: #231f20;
  padding: 4px;
  color: #f1f1f1;
}

.sheet-select-atributo {
  display: flex;
}

.sheet-atrbox-hab label {
  padding: 10px;
  width: 100%;
  font-weight: bold;
  background: #231f20;
  color: #f1f1f1;
  text-align: center;
}

.sheet-fac-recursos {
  display: flex;
  justify-content: space-around;
  width: 900px;
}

.sheet-facanhas {
  display:  block;
  width: 500px;
}

.sheet-facanhas h2 {
    background: #231f20;
  color: #f1f1f1;
  text-align: center;
}

.sheet-facanhas input {
  width: 380px;
  height: 40px;
  border: 3px solid #000;
  margin: 0 auto;

}

.sheet-facanhas select {
  width: 90px;
  height: 48px;
}

.sheet-fac-item {
  display: flex;
  justify-content: space-around;
  margin-bottom: 20px;
}

.sheet-recursos {
  width: 348px;
  background: #231f20;
}

.sheet-recursos label {
  color: #f1f1f1;
  margin-right: 5px;
}

.sheet-recursos h2 {
      background: #231f20;
  color: #f1f1f1;
  text-align: center;
}

.sheet-recursos input {
  width: 200px;
  height: 40px;
  border: 3px solid #000;
  margin: 0 auto;
}

.sheet-rec-item {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 20px;
}

.sheet-recurso-anotacao {
  display: flex;
  justify-content: space-around;
}

.sheet-recurso {
  width: 400px;
  background: #231f20;
}
.sheet-recurso h2 {
  color: #f1f1f1;
  text-align: center;
}

.sheet-recurso label {
  color: #f1f1f1;
  margin-right: 10px;
}

.sheet-texto {
  height: 200px;
  width: 380px;
  margin-top: 10px;
  font-size: 1.5em;
}

.sheet-texto-anotacao {
  height: 232px;
  width: 390px;
  margin-top: 10px;
  font-size: 1.5em;
}