img#temple {
  position: relative;
  top: 0;
  left: 0;
  width: 341.25px;
}

section.home {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

div.home__agitation {
  display: flex;
  flex-direction: column;
  position: relative;
  top: 26.25px;
  right: 103.5px;
}

div.home__imgs {
  width: 825px;
  height: 255px;
  position: relative;
}

@supports (animation-timeline: scroll()) {
  div.home__imgs img:nth-child(2) {
    transform: translateX(-30px);
    opacity: 0.1;
    animation-name: show__move;
    animation-timeline: scroll(root);
    animation-range: 0px 75px;
    animation-fill-mode: both;
    animation-timing-function: linear;
    z-index: -1;
  }
}

div.home__imgs img:nth-child(1) {
  width: 791.25px;
  position: absolute;
  top: 0;
  left: 0;
}
div.home__imgs img:nth-child(2) {
  width: 791.25px;
  position: absolute;
  top: 0;
  left: 30px;
  z-index: 1;
}

@keyframes show__move {
  to {
    transform: translateX(0px);
    opacity: 1;
    z-index: 1;
  }
}

div.home__agitation__texts {
  width: 928.5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-wrap: nowrap;

  & > span {
    font-family: "TikTok-Light";
    font-size: 6.5625em;
    color: #be0505;
    letter-spacing: 0.07em;
  }
  & div {
    width: 375px;
    display: flex;
    flex-direction: column;

    & span {
      line-height: 1.4;
      font-family: "TikTok-SemiBold";
      font-size: 3rem;
      color: #000;
      letter-spacing: 0.07em;
    }
  }
}
section.meet {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

div.left__obj {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  padding-left: 0.9375rem;
  width: 765px;
  height: 836.25px;
}
img[alt="Gubochkin Vasiliy"] {
  width: 657.75px;
}
div.meet__text {
  margin-top: 37.5px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 750px;
}
div.meet__text > h1 {
  font-family: "Kosmos";
  overflow: visible;
  font-size: 3rem;
  font-weight: 400;
  color: #be0505;
  letter-spacing: 0.07em;
}

div.meet__text > p {
  font-family: "TikTok-Light";
  font-size: 1.875rem;
  color: #0f1961;
  text-align: center;
  letter-spacing: 0.07em;
}
b {
  font-family: "TikTok-Medium";
  font-size: 1.875rem;
  color: #0f1961;
  letter-spacing: 0.07em;
}
div.img__text {
  display: flex;
  flex-direction: column;
  align-items: end;
}
div.img__text > span {
  font-family: "Kosmos";
  overflow: visible;
  font-size: 2.25rem;
  font-weight: 400;
  color: #be0505;
  position: relative;
  letter-spacing: 0.07em;
  left: 93.75px;
}
div.img__text > span + span {
  font-family: "TikTok-Light";
  font-size: 1.875rem;
  color: #0f1961;
  position: relative;
  letter-spacing: 0.07em;
  left: 131.25px;
}

section.calendar__of__events {
  padding-inline: 0.703125rem;
  padding-top: 2.34375rem;
  height: 1050px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

#play__pause {
  display: none;
  position: absolute;
  top: 131.25px;
  right: 0;
  font-family: "TikTok-Regular";
  font-size: 1.6875rem;
  color: #0f1961;
  text-align: center;
  letter-spacing: 0.07em;
}

.events__carusel {
  overflow-x: scroll;
  display: flex;
  width: 100%;
  justify-content: center;
}

.events__carusel::-webkit-scrollbar {
  display: none;
}
div.events {
  height: 825px;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: start;
}

.event {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 25.5px;
  gap: 15px;
  height: 100%;
  width: 349px;
  text-decoration: none;
}
.play {
  animation-play-state: running;
}
.pause {
  animation-play-state: paused;
}

div.slide {
  animation-name: calendar__of__events;
  animation-iteration-count: infinite;
  animation-duration: 16s;
  animation-timing-function: linear;
}
@keyframes calendar__of__events {
  from {
    translate: 0;
  }
  to {
    translate: -100%;
  }
}

div.event__img {
  width: 349px;
  height: 516px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 1.40625rem;
  margin-bottom: 10.5px;
  box-shadow: 4px 4px 4px 2px rgba(0, 0, 0, 0.25);
}
div.event__describes {
  width: 349px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
div.event__describes > h1 {
  font-family: "TikTok-SemiBold";
  font-size: 1.6875rem;
  color: #000;
  text-align: center;
  margin-bottom: 12px;
  letter-spacing: 0.07em;
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2; /* количество строк */
  -webkit-box-orient: vertical;
  overflow: hidden;
}
div.event__describes > p {
  font-family: "TikTok-Light";
  font-size: 1.6875rem;
  color: #0f1961;
  text-align: center;
  letter-spacing: 0.07em;
  display: -webkit-box;
  line-clamp: 4;
  -webkit-line-clamp: 4; /* количество строк */
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/*  */

img.buttons {
  cursor: pointer;
}
img.buttons:hover {
  opacity: 0.9;
  scale: 0.98;
  transition: 0.2s ease all;
}

img.buttons:active {
  opacity: 0.7;
  scale: 0.9;
  transition: 0.2s ease all;
}

div.news__block {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

div.block__of__news {
  display: flex;
}

.news {
  position: relative;
  display: none;
  width: 1026px;
  height: 671.25px;
  border-radius: 1.40625rem;
}
.news > div {
  box-shadow: -4px 3px 24.4px 2px rgba(0, 0, 0, 0.25);
  width: 100%;
  height: 100%;
  border-radius: 1.40625rem;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.news > div > img[alt="logo"] {
  position: absolute;
  top: 42px;
  left: 37.5px;
  z-index: 2;
}
.news > div > img[alt="cloud"] {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1;
  border-radius: 1.40625rem;
  width: 100%;
}
.news > div > h3.news__heading {
  position: absolute;
  top: 405px;
  left: 49.5px;
  width: 423.75px;
  font-family: "Kosmos";
  overflow: visible;
  font-size: 1.875rem;
  font-weight: 400;
  color: #be0505;
  letter-spacing: 0.07em;
  z-index: 2;
}
.current__news {
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

section.news__section {
  margin-bottom: 67.5px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 15px;
}

/* ===================== адаптив ================= */
@media screen and (max-width: 1439px) {
  img#temple {
    width: 256px;
  }
  div.home__agitation {
    top: 20px;
    right: 77px;
  }

  div.home__imgs {
    width: 619px;
    height: 191px;
  }

  div.home__imgs img:nth-child(1) {
    width: 593px;
  }
  @supports (animation-timeline: scroll()) {
    div.home__imgs img:nth-child(2) {
      transform: translateX(-22px);
    }
  }
  div.home__imgs img:nth-child(2) {
    width: 593px;
    left: 22px;
  }

  div.home__agitation__texts {
    width: 696px;

    & > span {
      font-size: 4.9rem;
    }
    & div {
      width: 281px;
      & span {
        font-size: 2.2rem;
      }
    }
  }

  div.left__obj {
    padding-left: 0.7rem;
    width: 574px;
    height: 627px;
  }
  img[alt="Gubochkin Vasiliy"] {
    width: 493px;
  }
  div.meet__text {
    margin-top: 29px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 562px;
  }
  div.meet__text > h1 {
    font-size: 2.2rem;
  }

  div.meet__text > p {
    font-size: 1.4rem;
  }
  b {
    font-size: 1.4rem;
  }
  div.img__text > span {
    font-size: 1.6rem;
    left: 71px;
  }
  div.img__text > span + span {
    font-size: 1.4rem;
    left: 98px;
  }

  section.calendar__of__events {
    padding-left: 0.5rem;
    padding-top: 1.6rem;
    height: 787px;
  }
  #play__pause {
    top: 90px;
    right: 30px;
    font-size: 1.3rem;
  }
  div.events {
    height: 619px;
  }

  .event {
    margin: 0 19px;
    gap: 11px;
    width: 262px;
  }
  div.event__img {
    width: 100%;
    height: 387px;
    border-radius: 1rem;
    margin-bottom: 8px;
  }
  div.event__describes {
    width: 100%;
  }
  div.event__describes > h1 {
    font-size: 1.3rem;
    margin-bottom: 9px;
  }
  div.event__describes > p {
    font-size: 1.3rem;
  }
  /*  */
  img.buttons {
    width: 99px;
  }
  .news {
    width: 770px;
    height: 503px;
    border-radius: 1rem;
  }
  .news > div > img[alt="logo"] {
    position: absolute;
    top: 30px;
    left: 22px;
    z-index: 2;
  }
  .news > div > img[alt="cloud"] {
    border-radius: 1rem;
  }
  .news > div > h3.news__heading {
    top: 303px;
    left: 37px;
    width: 318px;
    font-size: 1.3rem;
  }
  section.news__section {
    margin-bottom: 51px;
  }
}
/* ========================================= */
@media screen and (max-width: 1079px) {
  img#temple {
    width: 230px;
  }
  div.home__agitation {
    top: 18px;
    right: 69px;
  }

  div.home__imgs {
    width: 557px;
    height: 172px;
  }

  div.home__imgs img:nth-child(1) {
    width: 534px;
  }
  @supports (animation-timeline: scroll()) {
    div.home__imgs img:nth-child(2) {
      transform: translateX(-20px);
    }
  }
  div.home__imgs img:nth-child(2) {
    width: 534px;
    left: 20px;
  }

  div.home__agitation__texts {
    width: 626px;

    & > span {
      font-size: 4.4rem;
    }
    & div {
      width: 253px;
      & span {
        font-size: 2rem;
      }
    }
  }

  div.left__obj {
    padding-left: 0.5rem;
    height: 564px;
  }
  img[alt="Gubochkin Vasiliy"] {
    width: 443px;
  }
  div.meet__text {
    margin-top: 29px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 562px;
  }
  div.meet__text > h1 {
    font-size: 2.2rem;
  }

  div.meet__text > p {
    font-size: 1.4rem;
  }
  b {
    font-size: 1.4rem;
  }
  div.img__text > span {
    font-size: 1.6rem;
    left: 71px;
  }
  div.img__text > span + span {
    font-size: 1.4rem;
    left: 98px;
  }

  section.calendar__of__events {
    padding-left: 0.5rem;
    padding-top: 1.6rem;
    height: 787px;
  }
  #play__pause {
    font-size: 1.3rem;
  }
  div.events {
    height: 619px;
  }

  .event {
    margin: 0 19px;
    gap: 11px;
    width: 262px;
  }
  div.event__img {
    width: 100%;
    height: 387px;
    border-radius: 1rem;
    margin-bottom: 8px;
  }
  div.event__describes {
    width: 100%;
  }
  div.event__describes > h1 {
    font-size: 1.3rem;
    margin-bottom: 9px;
  }
  div.event__describes > p {
    font-size: 1.3rem;
  }
  /*  */
  img.buttons {
    width: 99px;
  }
  .news {
    width: 770px;
    height: 503px;
    border-radius: 1rem;
  }
  .news > div > img[alt="logo"] {
    position: absolute;
    top: 30px;
    left: 22px;
    z-index: 2;
  }
  .news > div > img[alt="cloud"] {
    border-radius: 1rem;
  }
  .news > div > h3.news__heading {
    top: 303px;
    left: 37px;
    width: 318px;
    font-size: 1.3rem;
  }
  section.news__section {
    margin-bottom: 51px;
  }
}
/* ===================================================== */
@media screen and (max-width: 975px) {
  img#temple {
    opacity: 0.6;
  }
  div.home__agitation {
    top: 0px;
    left: -170px;
  }

  div.left__obj {
    padding-left: 40px;
    width: 390px;
    height: 425px;
  }
  img[alt="Gubochkin Vasiliy"] {
    width: 270px;
  }
  div.meet__text {
    margin-top: 29px;
    width: 100%;
  }
  div.meet__text > h1 {
    font-size: 1.2rem;
  }

  div.meet__text > p {
    font-size: 0.9rem;
  }
  b {
    font-size: 0.9rem;
  }
  div.img__text {
    position: relative;

    left: 60px;
  }
  div.img__text > span {
    font-size: 1rem;
    left: 71px;
  }
  div.img__text > span + span {
    font-size: 1.4rem;
    left: 98px;
  }

  section.calendar__of__events {
    padding-left: 0.5rem;
    padding-top: 1.6rem;
    height: 787px;
  }
  #play__pause {
    font-size: 1.3rem;
  }
  .event {
    margin: 0 19px;
    gap: 11px;
    width: 262px;
  }
  div.event__img {
    width: 100%;
    height: 387px;
    border-radius: 1rem;
    margin-bottom: 8px;
  }
  div.event__describes {
    width: 100%;
  }
  div.event__describes > h1 {
    font-size: 1.3rem;
    margin-bottom: 9px;
  }
  div.event__describes > p {
    font-size: 1.3rem;
  }
  /*  */
  img.buttons {
    display: none;
  }
  .news {
    width: 600px;
    height: 392px;
    border-radius: 1rem;
  }
  .news > div > img[alt="logo"] {
    position: absolute;
    width: 100px;
    top: 30px;
    left: 22px;
    z-index: 2;
  }
  .news > div > img[alt="cloud"] {
    border-radius: 1rem;
  }
  .news > div > h3.news__heading {
    top: 203px;
    left: 37px;
    width: 318px;
    font-size: 1.3rem;
  }
  section.news__section {
    margin-bottom: 51px;
  }
}
/* ============================================ */
@media screen and (max-width: 675px) {
  img#temple {
    opacity: 0.6;
    width: 115px;
  }
  div.home__agitation {
    top: 0px;
    left: -60px;
  }

  div.home__imgs {
    width: 278px;
    height: 86px;
  }

  div.home__imgs img:nth-child(1) {
    width: 267px;
  }
  @supports (animation-timeline: scroll()) {
    div.home__imgs img:nth-child(2) {
      transform: translateX(-10px);
    }
  }
  div.home__imgs img:nth-child(2) {
    width: 267px;
    left: 10px;
  }

  div.home__agitation__texts {
    width: 313px;

    & > span {
      font-size: 2.2rem;
    }
    & div {
      width: 126.5px;
      & span {
        font-size: 1rem;
      }
    }
  }

  div.left__obj {
    padding: 0;
    width: 100%;
    height: 325px;
  }
  img[alt="Gubochkin Vasiliy"] {
    display: none;
  }
  div.meet__text {
    margin-top: 29px;
    width: 80%;
    margin-inline: auto;
  }
  div.meet__text > h1 {
    font-size: 1.2rem;
  }

  div.meet__text > p {
    font-size: 0.9rem;
  }
  b {
    font-size: 0.9rem;
  }
  div.img__text {
    display: none;
  }

  section.calendar__of__events {
    padding-left: 0.5rem;
    padding-top: 1.6rem;
    height: 787px;
  }
  .event {
    margin: 0 19px;
    gap: 11px;
    width: 262px;
  }
  div.event__img {
    width: 100%;
    height: 387px;
    border-radius: 1rem;
    margin-bottom: 8px;
  }
  div.event__describes {
    width: 100%;
  }
  div.event__describes > h1 {
    font-size: 1.3rem;
    margin-bottom: 9px;
  }
  div.event__describes > p {
    font-size: 1.3rem;
  }
  /*  */
  img.buttons {
    display: none;
  }
  .news {
    width: 450px;
    height: 294px;
    border-radius: 1rem;
  }
  .news > div > img[alt="logo"] {
    position: absolute;
    width: 100px;
    top: 30px;
    left: 22px;
    z-index: 2;
  }
  .news > div > img[alt="cloud"] {
    border-radius: 1rem;
  }
  .news > div > h3.news__heading {
    top: 153px;
    left: 37px;
    width: 318px;
    font-size: 1.3rem;
  }
  section.news__section {
    margin-bottom: 51px;
  }
}
@media screen and (max-width: 560px) {
  img#temple {
    opacity: 0.6;
    width: 80px;
  }
  div.home__agitation {
    top: 0px;
    left: -60px;
  }

  div.home__imgs {
    width: 243px;
  }

  div.home__imgs img:nth-child(1) {
    width: 232px;
  }
  div.home__imgs img:nth-child(2) {
    width: 232px;
    left: 10px;
  }

  div.home__agitation__texts {
    width: 250px;

    & > span {
      font-size: 1.7rem;
    }
    & div {
      width: 93.5px;
      & span {
        font-size: 0.9rem;
      }
    }
  }

  div.left__obj {
    padding: 0;
    width: 100%;
    height: 400px;
  }
  img[alt="Gubochkin Vasiliy"] {
    display: none;
  }
  div.meet__text {
    margin-top: 29px;
    width: 80%;
    margin-inline: auto;
  }
  div.meet__text > h1 {
    font-size: 1.2rem;
  }

  div.meet__text > p {
    font-size: 0.9rem;
  }
  b {
    font-size: 0.9rem;
  }
  div.img__text {
    display: none;
  }

  section.calendar__of__events {
    padding-left: 0.5rem;
    padding-top: 1.6rem;
    height: 787px;
  }
  .event {
    margin: 0 19px;
    gap: 11px;
    width: 262px;
  }
  div.event__img {
    width: 100%;
    height: 387px;
    border-radius: 1rem;
    margin-bottom: 8px;
  }
  div.event__describes {
    width: 100%;
  }
  div.event__describes > h1 {
    font-size: 1.3rem;
    margin-bottom: 9px;
  }
  div.event__describes > p {
    font-size: 1.3rem;
  }
  /*  */
  img.buttons {
    display: none;
  }
  .news {
    width: 330px;
    height: 216px;
    border-radius: 1rem;
  }
  .news > div {
    border-radius: 1rem;
  }
  .news > div > img[alt="logo"] {
    position: absolute;
    width: 50px;
    top: 10px;
    left: 12px;
    z-index: 2;
  }
  .news > div > img[alt="cloud"] {
    border-radius: 1rem;
  }
  .news > div > h3.news__heading {
    top: 103px;
    left: 17px;
    width: 218px;
    font-size: 1rem;
  }
  section.news__section {
    margin-bottom: 51px;
  }
}
