/* line 1, ../../TEST TASK/sass/base/_base.scss */
* {
  box-sizing: border-box;
}

/* line 5, ../../TEST TASK/sass/base/_base.scss */
body {
  font-family: "Roboto", sans-serif;
  background: url(.././img/body.jpg) no-repeat;
  background-size: 100% 100%;
  margin: 0;
  padding: 0;
  min-height: 100vh;
  color: yellowgreen;
}

/* line 17, ../../TEST TASK/sass/base/_base.scss */
h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
}

/* line 27, ../../TEST TASK/sass/base/_base.scss */
.hidden {
  display: none;
}

/* line 1, ../../TEST TASK/sass/blocks/_modal.scss */
.modal {
  position: absolute;
  top: 50px;
  bottom: 50px;
  left: 50%;
  transform: translate(-50%);
  max-width: 660px;
  height: 95%;
  display: grid;
  grid-template-rows: min-content 1fr min-content;
  align-items: center;
  box-shadow: 10px 10px 10px 0px rgba(166, 242, 91, 0.781);
  background: transparent;
}

@media (max-width: 660px) {
  /* line 1, ../../TEST TASK/sass/blocks/_modal.scss */
  .modal {
    top: 20px;
    bottom: 20px;
    left: 20px;
    right: 20px;
    transform: none;
    width: auto;
  }
}

/* line 27, ../../TEST TASK/sass/blocks/_modal.scss */
.modal__header,
.modal__footer {
  display: flex;
  align-items: center;
  max-height: 90px;
  padding: 10px 10px;
  font-weight: 500;
  font-size: 22px;
  box-shadow: 0px 5px 5px 0px rgba(166, 242, 91, 0.781);
}

/* line 40, ../../TEST TASK/sass/blocks/_modal.scss */
.modal__content {
  height: 90%;
  padding: 10px 20px;
  overflow-y: auto;
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  box-shadow: 0px 5px 5px 0px rgba(166, 242, 91, 0.781);
}

/* line 54, ../../TEST TASK/sass/blocks/_modal.scss */
.modal__content p + p {
  margin-top: 1em;
}

/* line 1, ../../TEST TASK/sass/blocks/_title.scss */
.title-1 {
  font-weight: 500;
  font-size: 26px;
}

/* line 6, ../../TEST TASK/sass/blocks/_title.scss */
.title-1 + * {
  margin-top: 10px;
}

/* line 1, ../../TEST TASK/sass/blocks/_button.scss */
.button {
  border: 1px solid #fff;
  border-radius: 4px;
  max-width: 135px;
  padding: 5px 20px;
  font-weight: 500;
  font-size: 18px;
  background: transparent;
  color: yellowgreen;
  cursor: pointer;
  transition: color 0.2s ease-in, border-color 0.2s ease-in,
 background-color 0.2s ease-in;
}

/* line 19, ../../TEST TASK/sass/blocks/_button.scss */
.button:hover {
  color: #fff;
  border-color: yellowgreen;
  background-color: #9943f570;
}

/* line 1, ../../TEST TASK/sass/blocks/_button-row.scss */
.buttons-row {
  display: flex;
  gap: 20px;
}

/* line 1, ../../TEST TASK/sass/blocks/_card.scss */
.cards-wrapper {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

/* line 8, ../../TEST TASK/sass/blocks/_card.scss */
.cards-wrapper > * {
  flex-shrink: 0;
}

/* line 12, ../../TEST TASK/sass/blocks/_card.scss */
.cards-wrapper + * {
  margin-top: 10px;
}

/* line 16, ../../TEST TASK/sass/blocks/_card.scss */
.card {
  max-width: 200px;
  text-align: center;
  border: 1px solid #c1c1c1;
  border-radius: 4px;
  cursor: pointer;
  transition: color 0.2s ease-in, border-color 0.2s ease-in,
 background-color 0.2s ease-in;
}

/* line 29, ../../TEST TASK/sass/blocks/_card.scss */
.card:hover {
  color: #fff;
  border-color: yellowgreen;
  background-color: #9943f570;
}

/* line 35, ../../TEST TASK/sass/blocks/_card.scss */
.card__header {
  padding: 4px;
  height: 55px;
  border: 1px solid #c1c1c1;
  border-radius: 4px 4px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* line 45, ../../TEST TASK/sass/blocks/_card.scss */
.card__body {
  padding: 20px;
}

/* line 47, ../../TEST TASK/sass/blocks/_card.scss */
.card__body p {
  font-weight: 400;
  font-size: 16px;
  line-height: 120%;
  text-align: center;
}

/* line 55, ../../TEST TASK/sass/blocks/_card.scss */
.card__title {
  font-weight: 500;
  margin-bottom: 7px;
}

/* line 60, ../../TEST TASK/sass/blocks/_card.scss */
.card__icon {
  fill: yellow;
}

/* line 1, ../../TEST TASK/sass/blocks/_radio-select.scss */
.radio-select {
  width: 0;
  height: 0;
  opacity: 0;
  position: absolute;
  margin-left: -1000px;
  appearance: none;
}

/* line 10, ../../TEST TASK/sass/blocks/_radio-select.scss */
.radio-select:checked + .card {
  border: 3px solid blue;
  box-shadow: 10px 10px 10px 0px rgba(166, 242, 91, 0.781);
}

/* line 15, ../../TEST TASK/sass/blocks/_radio-select.scss */
.radio-select:checked + .card .card__icon {
  fill: #fff;
}

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

.ulyana,
.regina {
  font-size: 32px;
  line-height: 1.1;
}

@media (max-width: 660px) {
  .ulyana,
  .regina {
    font-size: 16px;
  }
}