

:root {
  --color1:#fff; /*Цвет фона блока*/
  --color2:#3C393C; /*Цвет текста*/
  --color3:#E9DED7; /*Цвет границы и фона темы*/
  --color4:#69805D; /*Цвет границы и фона активной темы*/
  --color5:#FFF9EA; /*Цвет текста активной темы*/
}

.lesson-themes-block {
  padding: 20px;
  border-radius:30px;
 box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 20px 20px rgba(0, 0, 0, 0.08);
  background:var(--color1);
  margin-bottom:20px;
}

.lesson-themes-block h2 {
 font-family: "Cormorant", sans-serif;
  font-size: 22px;
  line-height: 130%;
  color:var(--color2);
  margin-bottom:20px;
}

.lesson-themes-list {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.lesson-themes-list div {
  cursor:pointer;
  font-weight: 400;
  font-size: 14px;
  line-height: 120%;
  color:var(--color2);
  padding: 5px 15px;
  border-radius:50px;
  background:var(--color3);
  border:1px solid var(--color3);
  transition:all .3s;
}

.lesson-themes-list div:hover {
  border-color:rgba(60,57,60,0.3);
}

.lesson-themes-list div.active-theme {
  background:var(--color4);
  color:var(--color5);
  border-color:var(--color4);
}
