.learn {
  margin: auto;
  flex-direction: column; }

.tag .block__title_main {
  max-width: 100%; }

.infinite-loader {
  flex-basis: 100%; }

.learn-block {
  flex-direction: column;
  justify-content: space-between;
  gap: 0;
  padding: 24px 24px 16px 24px;
  margin-bottom: 16px; }
  .learn-block .block__title_main {
    margin: 24px 18px; }

.learn-category__head {
  background-color: #FFFFFF; }

.learn-category__head_content {
  padding: 24px;
  margin-bottom: 16px; }
  .learn-category__head_content .block__title_main {
    margin: 0 0 24px 0; }
  .learn-category__head_content .learn-category__title {
    margin-top: 0;
    font-size: 56px;
    font-weight: 500;
    line-height: 67px;
    margin-bottom: 30px; }

.learn-thumbnail {
  text-align: right; }

.learn-filters {
  display: flex;
  flex-direction: row;
  gap: 12px;
  border-radius: 0;
  justify-content: space-between; }

.learn-filters__button {
  padding: 6px 12px;
  font-size: 18px;
  font-weight: 400;
  line-height: 25px; }

.learn-filters__button:hover {
  background-color: #F5F5F5; }

.learn-filters__button_active {
  background-color: #F5F5F5; }

.learn-filters__button_course {
  background-color: #CBECDF; }

.learn__posts {
  display: flex;
  flex-direction: row;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center; }

.learn-post {
  background-color: #FFFFFF;
  border-radius: 8px;
  max-width: 420px;
  overflow: hidden;
  height: 405px;
  position: relative; }

.learn-post__overflow {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0; }

.learn-post_full {
  max-width: 100%;
  width: 100%;
  display: flex;
  flex-direction: row;
  padding: 8px 8px 8px 32px;
  height: auto;
  max-height: 226px; }
  .learn-post_full .learn-post__content {
    padding: 24px 0 0 0;
    display: flex;
    flex-direction: column;
    gap: 66px;
    margin-bottom: 22px;
    flex-basis: 60%; }
  .learn-post_full .learn-post__title {
    font-size: 28px;
    font-weight: 500;
    line-height: 34px; }
  .learn-post_full .button {
    max-width: 140px;
    font-weight: 400; }
  .learn-post_full .learn-post__thumbnail {
    flex-basis: 40%;
    width: auto;
    height: 100%;
    text-align: right; }
  .learn-post_full .learn-post__thumbnail img {
    margin: 0;
    transform: none; }

.post__meta {
  display: flex;
  align-items: center;
  gap: 8px; }

.learn-post__thumbnail {
  width: 420px;
  height: 200px;
  overflow: hidden;
  position: relative; }
  .learn-post__thumbnail img {
    width: 100%; }

.learn-post__content {
  padding: 24px; }

.learn-post__title {
  font-size: 24px;
  font-weight: 500;
  line-height: 29px; }

.learn__mobile {
  display: none; }

/* Hides navigation links and site footer when infinite scroll is active */
.infinite-scroll .navigation,
.infinite-scroll.neverending #footer {
  display: none; }

/* Shows the footer again in case all posts have been loaded */
.infinity-end.neverending #footer {
  display: block; }

.th .block__title_main, .ja .block__title_main {
  max-width: 100%; }

@media only screen and (max-width: 768px) {
  .learn__mobile {
    display: flex; }
  .learn-block {
    padding: 12px; }
    .learn-block .block__title_main {
      margin: 0 0 24px 0; }
    .learn-block .learn-thumbnail {
      max-width: 126px; }
  .learn-filters {
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-start;
    position: relative;
    padding: 10px 12px;
    height: 58px;
    transition: height 0.2s ease-out;
    margin: 16px 0; }
  .learn-filters__button_course {
    text-align: center;
    align-items: center;
    justify-content: center; }
  .learn__desktop {
    display: none; }
  .learn-category__head_content {
    margin-bottom: 0; }
    .learn-category__head_content .learn-category__title {
      font-size: 36px;
      font-weight: 500;
      line-height: 43px; }
  .learn-post {
    max-width: calc(50% - 8px);
    height: auto; }
  .learn-post_full {
    max-width: 100%;
    align-items: center;
    justify-content: space-between; }
  .learn-post_full .learn-post__content {
    margin-bottom: 0;
    flex-basis: 50%; }
  .learn-post_full .learn-post__thumbnail {
    height: auto; } }

@media only screen and (max-width: 500px) {
  .learn-filters {
    gap: 8px;
    justify-content: flex-start;
    position: relative;
    padding: 10px 12px;
    height: 58px;
    transition: height 0.2s ease-out;
    margin: 16px 0; }
    .learn-filters.learn-filters_closed {
      overflow: hidden; }
    .learn-filters::after {
      position: absolute;
      right: 12px;
      top: 16px;
      flex-shrink: 0;
      width: 30px;
      height: 30px;
      margin-left: auto;
      cursor: pointer;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7' fill='none'%3E%3Cpath d='M6.29385 4.52589L2.17644 0.409212C1.85098 0.0838041 1.32334 0.083851 0.997932 0.409317C0.672524 0.734782 0.672571 1.26242 0.998036 1.58783L6.29396 6.88281L11.589 1.58778C11.9144 1.26234 11.9144 0.734702 11.589 0.409265C11.2636 0.0838282 10.7359 0.0838282 10.4105 0.409265L6.29385 4.52589Z' fill='%23262119'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      content: "";
      transition: transform 0.2s ease-out;
      background-position: center;
      z-index: 10; }
    .learn-filters.learn-filters_opened {
      height: auto;
      transition: height 0.2s ease-out; }
    .learn-filters.learn-filters_opened::after {
      transform: rotate(-180deg); }
  .learn-filters__button {
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    height: 38px;
    z-index: 5; }
  .learn-post {
    max-width: 100%;
    padding-bottom: 32px; }
  .post__meta {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px; }
    .post__meta a {
      color: #666666; }
    .post__meta .learn-post__date {
      color: #666666; }
  .learn-post__content {
    padding: 12px; }
  .learn-post__title {
    font-size: 18px;
    font-weight: 500;
    line-height: 24px; }
  .learn-post_full {
    align-items: flex-start;
    flex-direction: column-reverse;
    padding: 8px 8px 24px 8px; }
    .learn-post_full .learn-post__thumbnail {
      border-radius: 8px;
      flex-basis: auto; }
    .learn-post_full .learn-post__content {
      gap: 24px;
      flex-basis: auto;
      padding-left: 20px;
      font-size: 24px;
      font-weight: 500;
      line-height: 29px; }
    .learn-post_full .button {
      padding: 10px; } }

@media only screen and (max-width: 359px) {
  .learn-filters__button {
    padding: 10px 5px; } }