body {
  font-family: 'Lobster', cursive;
}

@media print{@page {size: landscape}}
.container {
  width: 1000px;
  margin:auto;
}
.title {
  width: 300px;
  margin:auto;
}
.row {
  display: flex;
}
.col {
  flex: 1;
  padding-left: 20px;
  padding-right: 20px;
}
.field-text {
  display: flex;
  padding-bottom: 10px;
}
.field-text>label {
  flex:auto;
}
.field-text>input {
  flex:100;
}

h3, h4 {
  text-align: center;
  margin: 0px;
}

.attribute, .skill {
  margin-bottom: 2px;
}

.advantages, .dignity {
  margin-top: 10px;
  margin-bottom: 10px;
}

.virtues {
  margin-top: 15px;
  /* margin-bottom: 5px; */
}

.value {
  justify-content: space-between;
  display: flex;
  align-items: center;
}
.attr_name {
  flex: 1;
}
.dot_set {
  flex: 0;
  display: flex;
}
.dot {
  width: 12px;
  height: 12px;
  border: 1px solid black;
  border-radius: 7px;
  margin-left: 5px;
}
.dot[state="1"] {
  background-color: black;
}
.quad>.dot {
  border-radius: 0px;
}
.specialization {
  font-size: 6px;
  margin-top: -5px;
}
.specialization>input {
  width: 160px;
  margin:auto;
  display: block;
  text-align: center;
}

.virtues>.value {
  justify-content: center;
  margin-top: 5px;
}

.hr {
  display:flex;
  padding-bottom: 10px;
}
.hr>h2 {
  flex:auto;
  margin: 3px;
  align-self: center;
}
.hr>hr {
  flex: 100;
  height: 0px;
  align-self: center;
}

.path>input {
  margin-top: 10px;
  margin-bottom: 10px;
  width: 100%;
}
.path>.value {
  justify-content: center;
  margin-bottom: 10px;
}
.will>.value {
  margin-top: 10px;
  margin-bottom: 10px;
  justify-content: center;
}
.blood_pull>.value {
  margin-top: 10px;
  margin-bottom: 10px;
  justify-content: center;
  max-width: 300px;
}
.blood_pull>.value>.dot_set {
  justify-content: center;
  max-width: 300px;
  flex-wrap: wrap;
  flex: auto;
}
.blood_pull>.value>.dot_set>.dot {
  margin-bottom: 8px;
}

.helth_title {
  width: 200px;
}
.helth {
  display: flex;
  justify-content:space-between;
  margin-bottom: 10px;
}
.helth_dot {
  width: 12px;
  height: 12px;
  border: 1px solid black;
  margin-left: 5px;
  text-align: center;
}
.helth_dot>span {
  display: block;
  margin-top: -6px;
}

input[type="text"]:focus-visible, input[type="number"]:focus-visible {
  outline: none;
}

input[type="text"],input[type="number"] {
  border: none;
  border-bottom: 1px solid black;
}
.noborder {
  border: none !important;
}
.hidden {
  visibility: hidden !important;
}
#flaw {
  width: 100%;
  margin-top: 10px;
  margin-bottom: 20px;
  resize: none;
  height: 60px;
}
.expirience-container {
  justify-content: center;
}
#expirience {
  border: none !important;
  width: 40px;
  margin-top: 10px;
}

.noselect {
-webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
   -khtml-user-select: none; /* Konqueror HTML */
     -moz-user-select: none; /* Old versions of Firefox */
      -ms-user-select: none; /* Internet Explorer/Edge */
          user-select: none; /* Non-prefixed version, currently
                                supported by Chrome, Edge, Opera and Firefox */
}