:root {
  --Moderate-blue: hsl(238, 40%, 52%);
  --Soft-Red: hsl(358, 79%, 66%);
  --Light-grayish-blue: hsl(239, 57%, 85%);
  --Pale-red: hsl(357, 100%, 86%);
  --Dark-blue: hsl(212, 24%, 26%);
  --Grayish-Blue: hsl(211, 10%, 45%);
  --Light-gray: hsl(223, 19%, 93%);
  --Very-light-gray: hsl(228, 33%, 97%);
  --White: hsl(0, 0%, 100%);
}

.center {
  min-height: 100vh;
}

.comment-setion {
  padding: 1.5625rem;
  background: var(--White);
  border-radius: 0.625rem;
}
.comment-setion section:first-child img {
  width: 2.5rem;
  height: 2.5rem;
}
.comment-setion textarea {
  width: 31.25rem;
  height: 5.9375rem;
  resize: none;
  padding: 0.9375rem;
  border: 0.0625rem solid var(--Light-gray);
  outline: none;
  border-radius: 0.3125rem;
  margin-right: 0.9375rem;
  margin-left: 0.9375rem;
}
.comment-setion textarea:hover {
  cursor: pointer;
}

*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  transition: 1s;
}

html,
body {
  font-size: 1rem;
  font-family: "Rubik", sans-serif;
  background: var(--Very-light-gray);
}

button {
  width: 6.25rem;
  height: 3.125rem;
  border: none;
  cursor: pointer;
  background: var(--Moderate-blue);
  color: var(--White);
  border-radius: 0.5rem;
  font-weight: 500;
}
button:hover {
  background: var(--Light-grayish-blue);
}

.flex {
  display: flex;
}
.flex-jc-c {
  justify-content: center;
}
.flex-jc-sb {
  justify-content: space-between;
}
.flex-ai-c {
  align-items: center;
}
.flex-col {
  flex-direction: column;
}

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