@charset "UTF-8";

.interesting {
  padding: 80px 0;
  color: #fff;  
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
}

.interesting__row {
  display: -ms-grid;
  display: grid;
  gap: 20px;
  -ms-grid-columns: (1fr)[4];
      grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: minmax(420px, 1fr);
  grid-auto-flow: dense;
  overflow: hidden;
  -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  margin-bottom: 60px;
}

.interesting__image {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  border-radius: 20px;
  height: 420px;
}

.interesting__images img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  border-radius: 20px;
  height: 420px;
  position: absolute;
  left: 0;
  top: 0;
}

.interesting__images img:first-child {
  position: static;
  display: block;
}

.interesting__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
  border-radius: 20px;
}

.interesting__item.main_news {
    grid-column: span 2;
    grid-row: span 2;
}

.interesting__item.main_news .interesting__subtitle {
    font-size: 32px;
    line-height: 40px;    
}

.interesting__subtitle h3 {
	font-weight: 400;
}

.category {
  border-radius: 10px;
  padding: 10px 20px;
  font-size: 12px;
  line-height: 16px;
  color: #fff;
}

.category_events {
  background: #ff6482;
}

.category_blog {
  background: #3cc850;
}

.category_contest {
  background: #0078ff;
}

@media (max-width: 1200px) {
}

@media (max-width: 1100px) {
}

@media (max-width: 700px) {
  .interesting .category {
    padding: 10px;
  }
}

.main_news .category,
.interesting__item:first-child.main_news .category {
    font-size: 18px;
    line-height: 24px;
}

.interesting__item.main_news .interesting__info {
    padding: 20px;
}

.interesting__item.main_news .interesting__image {
    height: 860px;
}

.interesting__item.main_news .interesting__share {
    width: 44px;
    height: 44px;
}

.interesting__item.main_news .interesting__subtitle {
    margin-left: 20px;
    margin-right: 20px;
    bottom: 20px;
}

.interesting__item:hover {
  cursor: pointer;
}

.interesting__info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 10px;
}

.interesting__share {
  background: url("../images/interesting/share.svg") #2d3d89 no-repeat center center;
  padding: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-radius: 10px;
  width: 36px;
  height: 36px;
}

.interesting__subtitle {
  background: #2d3d89;
  -webkit-backdrop-filter: blur(25px);
          backdrop-filter: blur(25px);
  border-radius: 10px;
  padding: 10px 20px;
  font-size: 18px;
  line-height: 24px;
  position: absolute;
  bottom: 10px;
  margin: 0 10px;
}

.interesting__description {
  display: none;
}

.interesting__add {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
}

.interesting__link, .interesting__link-hide {
  padding: 13px 17px;
  border-radius: 6px;
  background-color: var(--blue);
  box-shadow: 0px 2px 4px 0px rgba(58, 58, 68, 0.2), 0px 4px 8px 0px rgba(90, 91, 106, 0.2);
  color: var(--white);
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-weight: 500;
  line-height: 20px;
  position: relative;
  cursor: pointer;  
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
	display: flex;
	gap: 10px;
	width: 225px;
	justify-content: center;
	align-items: center;
}

.interesting__link.visible, .interesting__link-hide.visible {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.interesting__link::after, .interesting__link-hide::after {
  content: "";
	display: block;
  width: 24px;
  height: 24px;
  background: url("../images/interesting/icon-add.png") no-repeat center center;
}

.interesting__link:hover, .interesting__link-hide:hover {
  background-color: #1d56b7;
}

.interesting__link-hide::after {
  background: url("../images/interesting/icon-hide.png") no-repeat center center;
}

@media (max-width: 1200px) {
}

@media (max-width: 1100px) {
  .interesting__row {
    grid-auto-rows: minmax(310px, 1fr);
  }
  .interesting__item.main_news {
    grid-column: span 2;
    grid-row: span 2;
  }
  .interesting__item.main_news .interesting__image {
    height: 640px;
  }
  .interesting__images img {
    height: 310px;
		width: 100%;
  }
}

@media (max-width: 900px) {
  .interesting__row {
    -ms-grid-columns: (1fr)[3];
        grid-template-columns: repeat(3, 1fr);
  }
  .interesting__item:first-child, .interesting__item:nth-child(5), .interesting__item:nth-child(7), .interesting__item:nth-child(11), .interesting__item:nth-child(13), .interesting__item:nth-child(17), .interesting__item:nth-child(19) {
    grid-column: span 2;
    grid-row: span 2;
  }
  .interesting__item:first-child .interesting__image, .interesting__item:nth-child(5) .interesting__image, .interesting__item:nth-child(7) .interesting__image, .interesting__item:nth-child(11) .interesting__image, .interesting__item:nth-child(13) .interesting__image, .interesting__item:nth-child(17) .interesting__image, .interesting__item:nth-child(19) .interesting__image {
    height: 640px;
  }
  .interesting__item:first-child .interesting__subtitle, .interesting__item:nth-child(5) .interesting__subtitle, .interesting__item:nth-child(7) .interesting__subtitle, .interesting__item:nth-child(11) .interesting__subtitle, .interesting__item:nth-child(13) .interesting__subtitle, .interesting__item:nth-child(17) .interesting__subtitle, .interesting__item:nth-child(19) .interesting__subtitle {
    word-wrap: break-word;
  }
  .interesting__item:first-child .interesting__subtitle h3, .interesting__item:nth-child(5) .interesting__subtitle h3, .interesting__item:nth-child(7) .interesting__subtitle h3, .interesting__item:nth-child(11) .interesting__subtitle h3, .interesting__item:nth-child(13) .interesting__subtitle h3, .interesting__item:nth-child(17) .interesting__subtitle h3, .interesting__item:nth-child(19) .interesting__subtitle h3 {
    font-size: 32px;
    line-height: 40px;    
  }
  .interesting__item:first-child .interesting__share, .interesting__item:nth-child(5) .interesting__share, .interesting__item:nth-child(7) .interesting__share, .interesting__item:nth-child(11) .interesting__share, .interesting__item:nth-child(13) .interesting__share, .interesting__item:nth-child(17) .interesting__share, .interesting__item:nth-child(19) .interesting__share {
    width: 44px;
    height: 44px;
  }
  .interesting__item:first-child .category, .interesting__item:nth-child(5) .category, .interesting__item:nth-child(7) .category, .interesting__item:nth-child(11) .category, .interesting__item:nth-child(13) .category, .interesting__item:nth-child(17) .category, .interesting__item:nth-child(19) .category {
    font-size: 18px;
    line-height: 24px;
  }
  .interesting__item:nth-child(8), .interesting__item:nth-child(18), .interesting__item:nth-child(21) {
    grid-column: span 1;
    grid-row: span 1;
  }
  .interesting__item:nth-child(8) .interesting__image, .interesting__item:nth-child(18) .interesting__image, .interesting__item:nth-child(21) .interesting__image {
    height: 310px;
  }
  .interesting__item:nth-child(8) .interesting__subtitle, .interesting__item:nth-child(18) .interesting__subtitle, .interesting__item:nth-child(21) .interesting__subtitle {
    word-break: break-word;
    bottom: 10px;
    margin: 0 10px;
  }
  .interesting__item:nth-child(8) .interesting__subtitle h3, .interesting__item:nth-child(18) .interesting__subtitle h3, .interesting__item:nth-child(21) .interesting__subtitle h3 {
    font-size: 18px;
    line-height: 24px;    
    word-wrap: break-word;
  }
  .interesting__item:nth-child(8) .category, .interesting__item:nth-child(18) .category, .interesting__item:nth-child(21) .category {
    font-size: 12px;
    line-height: 16px;
    padding: 10px 20px;
  }
  .interesting__item:nth-child(8) .interesting__share, .interesting__item:nth-child(18) .interesting__share, .interesting__item:nth-child(21) .interesting__share {
    width: 36px;
    height: 36px;
  }
  .interesting__item:nth-child(8) .interesting__info, .interesting__item:nth-child(18) .interesting__info, .interesting__item:nth-child(21) .interesting__info {
    padding: 10px;
  }
  .interesting__item .interesting__subtitle h3 {
    word-break: break-word;
  }
}

@media (max-width: 700px) {
  .interesting__row {
    grid-auto-rows: minmax(260px, 1fr);
  }
  .interesting__images img {
    height: 260px;
  }
  .interesting__item:first-child .interesting__image, .interesting__item:nth-child(5) .interesting__image, .interesting__item:nth-child(7) .interesting__image, .interesting__item:nth-child(11) .interesting__image, .interesting__item:nth-child(13) .interesting__image, .interesting__item:nth-child(17) .interesting__image, .interesting__item:nth-child(19) .interesting__image {
    height: 540px;
  }
  .interesting__item:first-child .interesting__subtitle h3, .interesting__item:nth-child(5) .interesting__subtitle h3, .interesting__item:nth-child(7) .interesting__subtitle h3, .interesting__item:nth-child(11) .interesting__subtitle h3, .interesting__item:nth-child(13) .interesting__subtitle h3, .interesting__item:nth-child(17) .interesting__subtitle h3, .interesting__item:nth-child(19) .interesting__subtitle h3 {
    font-size: 26px;
    line-height: 32px;
  }
  .interesting__item:nth-child(8) .interesting__image, .interesting__item:nth-child(18) .interesting__image, .interesting__item:nth-child(21) .interesting__image {
    height: 260px;
  }
  .interesting__item:nth-child(8) .interesting__subtitle h3, .interesting__item:nth-child(18) .interesting__subtitle h3, .interesting__item:nth-child(21) .interesting__subtitle h3 {
    font-size: 16px;
  }
  .interesting__subtitle {
    font-size: 16px;
    line-height: 20px;
    padding: 5px 10px;
    word-break: break-word;
  }
}

@media (max-width: 500px) {
  .interesting__row {
    -ms-grid-columns: (1fr)[2];
        grid-template-columns: repeat(2, 1fr);
  }
  .interesting:first-child, .interesting:nth-child(6), .interesting:nth-child(11), .interesting:nth-child(16), .interesting:nth-child(21) {
    grid-row: span 1;
  }
  .interesting__subtitle {
    word-break: break-word;
  }
  .interesting__title h2 {
    font-size: 38px;
    line-height: 38px;
  }
}