/*!*********************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./scssBuild.scss ***!
  \*********************************************************************************************************/
html {
  font-family: "Elms Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

h2 {
  text-align: center;
}

.mainPricingWrapper {
  display: grid;
  grid-template-columns: 3fr 1fr;
  gap: 1em;
  max-width: 1200px;
  margin: 0 auto;
}
.mainPricingWrapper .talk {
  display: flex;
  flex-direction: column;
  grid-column: 1;
  gap: 1em;
}
.mainPricingWrapper .talk .message {
  padding: 1em;
  border-radius: 1em;
  max-width: 80%;
  white-space: pre-wrap;
}
.mainPricingWrapper .talk .message-user {
  align-self: end;
  background: #a8e676;
  border-top-left-radius: 2em;
  border-bottom-left-radius: 2em;
}
.mainPricingWrapper .talk .message-system {
  background: #b8b8b8;
  align-self: start;
  border-top-right-radius: 2em;
  border-bottom-right-radius: 2em;
}
.mainPricingWrapper .price {
  grid-column: 2;
}
.mainPricingWrapper form {
  grid-column: 1;
  display: flex;
}
.mainPricingWrapper form textarea {
  flex: 1 1 auto;
  background: white;
  border: 1px solid lightgray;
  resize: none;
}
.mainPricingWrapper form button {
  background: #8d8;
  border: none;
}
