/*Klient formular*/
@media screen and (max-width: 1440px) {
  .klient-layout {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center; }

  .Vysvetlivky {
    margin-top: 50px;
    max-width: 630px; } }
@media screen and (min-width: 1440px) {
  .klient-layout {
    display: grid;
    grid-template-columns: 1fr minmax(0, 650px);
    grid-template-rows: 1fr;
    gap: 40px; }

  .formular-grid {
    margin: 0 auto;
    grid-column: 1/2;
    grid-row: 1/2; }

  .Vysvetlivka-mala {
    padding-right: 20px;
    margin-bottom: 10px;
    height: fit-content;
    grid-column: 2/3;
    grid-row: 1/2; }

  .Vysvetlivka-CiloveSkupiny {
    margin-bottom: 10px;
    grid-column: 2/3;
    grid-row: 1/2; } }
.formular-grid {
  background-color: #e2e3e5;
  height: fit-content;
  border-radius: 20px;
  padding: 20px; }
  .formular-grid .formular-grid-datum_Narozeni input {
    font-size: 16px; }
  .formular-grid input[type='checkbox'], .formular-grid input[type='date'], .formular-grid select {
    cursor: pointer; }

/*Klient-formular-grid*/
@media screen and (max-width: 900px) {
  .formular-grid > p {
    width: fit-content; }

  .formular-grid {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin: 20px 0; }

  .formular-grid-nadpis {
    font-size: 32px;
    font-weight: bold;
    margin: auto;
    width: fit-content;
    margin-bottom: 20px;
    text-align: center; }

  .formular-grid label {
    margin-left: 10px;
    font-weight: bold; }

  .formular-grid input, .formular-grid select {
    font-size: 20px;
    width: 260px; }

  .formular-grid .formular-checkbox {
    width: 13px;
    margin-right: 5px; }

  #formulat-datum_Narozenin-Pouze_Rok {
    font-weight: normal; }

  .formular-grid-poznamky textarea {
    width: 100%;
    resize: none; }

  #form-vytvorit-cilovaSkupina {
    width: 100%; }

  #form-vytvorit-datum-priblizne, #form-vytvorit-datum-cele {
    width: 170px;
    max-width: 100%;
    margin-bottom: 5px; }

  .formular-grid-ulozit {
    margin: auto;
    width: fit-content; } }
@media screen and (min-width: 900px) {
  .formular-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 100px repeat(7, 75px) 180px 50px;
    width: 670px; }

  .formular-grid-jmeno {
    grid-column: 1/2;
    grid-row: 2/3; }

  .formular-grid-prijmeni {
    grid-column: 1/2;
    grid-row: 3/4; }

  .formular-grid-prezdivka {
    grid-column: 1/2;
    grid-row: 4/5; }

  .formular-grid-pohlavi {
    grid-column: 1/2;
    grid-row: 5/6; }

  .formular-grid-datum_Narozeni {
    grid-column: 1/2;
    grid-row: 6/8; }

  .formular-grid-obec {
    grid-column: 2/3;
    grid-row: 2/3; }

  .formular-grid-telefon {
    grid-column: 2/3;
    grid-row: 3/4; }

  .formular-grid-email {
    grid-column: 2/3;
    grid-row: 4/5; }

  .formular-grid-KlientSocial {
    grid-column: 2/3;
    grid-row: 5/6; }

  .formular-grid-OsobaZdravot {
    grid-column: 2/3;
    grid-row: 6/7; }

  .formular-grid-PocetClenu {
    grid-column: 2/3;
    grid-row: 7/8; }

  .formular-grid-CilovaSkupina {
    grid-column: 1/3;
    grid-row: 8/9; }

  .formular-grid-poznamky {
    grid-column: 1/3;
    grid-row: 9/10; }

  .formular-grid-ulozit {
    grid-column: 1/3;
    grid-row: 10/11;
    width: fit-content;
    margin: auto; }

  .formular-poznamky-textarea {
    width: 100%;
    height: 150px;
    resize: none; }

  .formular-grid input, .formular-grid select {
    font-size: 20px;
    width: 260px; }

  .formular-grid-CilovaSkupina select {
    width: 500px; }

  .formular-grid label {
    font-weight: bold;
    margin-left: 10px; }

  .formular-grid-nadpis {
    font-size: 40px;
    grid-column: 1/3;
    grid-row: 1/2;
    width: fit-content;
    margin: auto;
    font-weight: bold; }

  #form-vytvorit-datum-priblizne, #form-vytvorit-datum-cele {
    width: 170px;
    margin-bottom: 5px; }

  #formulat-datum_Narozenin-Pouze_Rok {
    font-weight: normal; }

  .formular-grid .formular-checkbox {
    width: 13px;
    margin-right: 5px; } }
@media screen and (max-width: 445px) {
  .formular-grid > p {
    width: 100%; }

  .formular-grid input, .formular-grid select {
    font-size: 20px;
    width: 100%; }

  .formular-grid-nadpis {
    font-size: 24px;
    width: 100%; } }
.form-box.required label:after {
  content: "*";
  color: red; }

/*Klient-formular-vysvetlivky*/
.tlacitka {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 10px; }

.Vysvetlivky {
  max-width: 630px; }
  .Vysvetlivky .Vysvetlivka-mala {
    margin: 10px 0; }
  .Vysvetlivky .Vysvetlivka-CiloveSkupiny {
    max-height: 82px;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out; }
    .Vysvetlivky .Vysvetlivka-CiloveSkupiny svg {
      width: 40px;
      margin: auto;
      margin-bottom: 20px;
      display: block;
      transform: rotate(0deg);
      transition: transform 0.5s ease-in-out,background-color 0.3s ease-in-out;
      border-radius: 50%; }
      .Vysvetlivky .Vysvetlivka-CiloveSkupiny svg:hover {
        background-color: rgba(10, 10, 10, 0.101); }
    .Vysvetlivky .Vysvetlivka-CiloveSkupiny > ul h4 {
      font-weight: bold; }
    .Vysvetlivky .Vysvetlivka-CiloveSkupiny > div {
      width: 100%;
      cursor: pointer; }
  .Vysvetlivky .Vysvetlivka-CiloveSkupiny,
  .Vysvetlivky .Vysvetlivka-mala {
    background-color: #e2e3e5;
    border: 1px solid #d3d6d8;
    padding: 20px;
    padding-bottom: 10px; }
    .Vysvetlivky .Vysvetlivka-CiloveSkupiny h4,
    .Vysvetlivky .Vysvetlivka-mala h4 {
      font-size: 20px;
      font-weight: bold; }
    .Vysvetlivky .Vysvetlivka-CiloveSkupiny ul,
    .Vysvetlivky .Vysvetlivka-mala ul {
      padding-left: 1rem; }
  .Vysvetlivky .Vysvetlivka-CiloveSkupiny-expanded {
    max-height: 2000px; }
    .Vysvetlivky .Vysvetlivka-CiloveSkupiny-expanded #Vysvetlivka-CiloveSkupiny-svgarrow svg {
      transform: rotate(180deg); }

#Vysvetlivka-CiloveSkupiny-ul ul li:nth-child(1) {
  transition: visibility .7s .1s; }
#Vysvetlivka-CiloveSkupiny-ul ul li:nth-child(2) {
  transition: visibility .7s .2s; }
#Vysvetlivka-CiloveSkupiny-ul ul li:nth-child(3) {
  transition: visibility .7s .3s; }
#Vysvetlivka-CiloveSkupiny-ul ul li:nth-child(4) {
  transition: visibility .7s .4s; }
#Vysvetlivka-CiloveSkupiny-ul ul li:nth-child(5) {
  transition: visibility .7s .5s; }
#Vysvetlivka-CiloveSkupiny-ul ul li:nth-child(6) {
  transition: visibility .7s .6s; }

@media screen and (max-width: 800px) {
  .tlacitka {
    margin: 20px 0;
    flex-direction: column;
    align-items: center; }

  .tlacitka a, .tlacitka button {
    width: 200px; } }

/*# sourceMappingURL=clients.css.map */