html {
    scroll-behavior: smooth;
  }

body {
    font-family: 'Montserrat', sans-serif;
}

html, body {
    margin: 0;
    padding: 0;
    min-height: 100%;
    height: 100%;
    overflow-x: hidden;
    
}

.logo_ani svg{

    width:100%;
    height: auto;
}

.logo_ani {

    max-width:50em;
}

.logo_container {

    display:flex;
    justify-content: center;
}

.magic-rectangle {
    position: absolute;
    width: 50%;
    height: 10%;
    left: 3%;
    top: 8%;
    background-color: #000000;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    rotate: -5deg;
    animation: pulse 2s ease-in-out infinite; /* Добавляем анимацию */
}

/* Определяем ключевые кадры анимации */
@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1); /* Увеличиваем размер на 10% */
    }
    100% {
        transform: scale(1);
    }
}

.text-carousel {
    width: 100%;
    height: 100%;
    position: relative;
}

.floating-text {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 24px;
    font-family: Arial, sans-serif;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;
}

.floating-text.visible {
    opacity: 1;
    transform: translateY(0);
}

.intro {
    display: flex;
    width: 100%;
    max-width: 37em;
    flex-direction: column;
    align-items: flex-start;
}

.intro img {
    width:100%;
    max-width: 55em;
}

.intro {
    position: relative;
    width: 100%;
}

.intro img {
    width: 95%;
    height: auto;
    display: block;
    margin: 0 auto; /* добавляем центрирование */
    transition: transform 1s ease-out, width 0.4s ease-out;/* убрана лишняя запятая */
}

.intro img:hover {
    width: 97%;
}

.text-carousel {
    width: 100%;
    height: 100%;
}

.floating-text {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:  min(3vw, 1.2em);
}

.whiteblock {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height:100vh;
}

.greenblock {
    /*background-color: #67a086;*/
    background-color: #0e472d;
    color:white;
    min-height:100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

a {
  color:#67a086;

}

.whitecard {
  background-color: white;
  border-radius: 2em;
  color: black;
  margin: 1em;
  padding: 2em;
  max-width: 72em;
  display: flex;
  flex-direction: row;
}

h2 {
  font-size: 2em;
    margin-block-start: 0em;
}

p {
  font-size: 1.5em;
}

.partof {
  width: 50%;
  
}

.partof img {
  width: 100%;
}

.megaimg {
  display: flex;
    gap: 1em;
}

.megaimg img {
  width:5em;
}


@media screen and (min-width: 768px) {
.bitleft {
  position: relative;
    left: -2em;
}

.bitright {
  position: relative;
    left: 2em;
}
}

.pinlogo img {
  width: 2em;
}

.pinlogo h2 {
display: flex;
align-items: center;
gap: 0.5em;
}

h1 {
  font-size: 2.3em;
}

.bigimgright {
  flex-direction: row;
}

.plastic {
  width: 50%;
  display: flex;
    align-items: flex-end;
}

.plastic img {

  width: 100%;
  
}

.foot {
  display: flex;
    padding: 2em;
    justify-content: space-between;
}

.foot img {
  width: 90%;
  max-width: 30em;
}

/* МОБИЛЬНАЯ ОПТИМИЗАЦИЯ */
/* МОБИЛЬНАЯ ОПТИМИЗАЦИЯ */

@media screen and (max-width: 768px) {

  
  h2 {
            font-size: 1.2em;
    margin-block-start: 0em;
  }
  h1 {
    font-size: 1.6em;
  }

  p {
    font-size: 1em;  /* 1.5 / 1.5 = 1 */
  }

  .whitecard{
    flex-direction: column;
  }
  .partof {
    width: 100%;
    
  }
  .bigimgright {
    flex-direction: column;
  }
  .plastic {
    width: 100%;
    display: flex;
      align-items: flex-end;
  }

  .foot {
    flex-direction: column-reverse;
  }
}

.megaimg{

    transition: transform 0.3s ease-out;
}

.megaimg:hover {
    transform: scale(1.02)
}


.fade-in {
  opacity: 0;
  transform: translateY(60px) scale(0.9);
  transition: opacity 1.5s ease-out, transform 0.7s ease-out;
}

.fade-in.show {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/***************************************************
 * Generated by SVG Artista on 1/16/2025, 2:43:57 PM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/

 @-webkit-keyframes animate-svg-fill-1{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-1{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-1{-webkit-animation:animate-svg-fill-1 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.2s both;animation:animate-svg-fill-1 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.2s both}@-webkit-keyframes animate-svg-fill-2{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-2{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-2{-webkit-animation:animate-svg-fill-2 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.25s both;animation:animate-svg-fill-2 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.25s both}@-webkit-keyframes animate-svg-fill-3{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-3{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-3{-webkit-animation:animate-svg-fill-3 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.30000000000000004s both;animation:animate-svg-fill-3 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.30000000000000004s both}@-webkit-keyframes animate-svg-fill-4{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-4{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-4{-webkit-animation:animate-svg-fill-4 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.35000000000000003s both;animation:animate-svg-fill-4 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.35000000000000003s both}@-webkit-keyframes animate-svg-fill-5{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-5{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-5{-webkit-animation:animate-svg-fill-5 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.4s both;animation:animate-svg-fill-5 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.4s both}@-webkit-keyframes animate-svg-fill-6{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-6{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-6{-webkit-animation:animate-svg-fill-6 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.45s both;animation:animate-svg-fill-6 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.45s both}@-webkit-keyframes animate-svg-fill-7{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-7{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-7{-webkit-animation:animate-svg-fill-7 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.5s both;animation:animate-svg-fill-7 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.5s both}@-webkit-keyframes animate-svg-fill-8{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-8{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-8{-webkit-animation:animate-svg-fill-8 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.55s both;animation:animate-svg-fill-8 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.55s both}@-webkit-keyframes animate-svg-fill-9{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-9{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-9{-webkit-animation:animate-svg-fill-9 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.6000000000000001s both;animation:animate-svg-fill-9 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.6000000000000001s both}@-webkit-keyframes animate-svg-fill-10{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-10{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-10{-webkit-animation:animate-svg-fill-10 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.65s both;animation:animate-svg-fill-10 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.65s both}@-webkit-keyframes animate-svg-fill-11{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-11{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-11{-webkit-animation:animate-svg-fill-11 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.7s both;animation:animate-svg-fill-11 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.7s both}@-webkit-keyframes animate-svg-fill-12{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-12{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-12{-webkit-animation:animate-svg-fill-12 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.75s both;animation:animate-svg-fill-12 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.75s both}@-webkit-keyframes animate-svg-fill-13{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-13{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-13{-webkit-animation:animate-svg-fill-13 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.8s both;animation:animate-svg-fill-13 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.8s both}@-webkit-keyframes animate-svg-fill-14{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-14{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-14{-webkit-animation:animate-svg-fill-14 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.8500000000000001s both;animation:animate-svg-fill-14 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.8500000000000001s both}@-webkit-keyframes animate-svg-fill-15{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-15{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-15{-webkit-animation:animate-svg-fill-15 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.9000000000000001s both;animation:animate-svg-fill-15 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.9000000000000001s both}@-webkit-keyframes animate-svg-fill-16{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-16{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-16{-webkit-animation:animate-svg-fill-16 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.95s both;animation:animate-svg-fill-16 0.2s cubic-bezier(0.39,0.575,0.565,1) 0.95s both}@-webkit-keyframes animate-svg-fill-17{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-17{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-17{-webkit-animation:animate-svg-fill-17 0.2s cubic-bezier(0.39,0.575,0.565,1) 1s both;animation:animate-svg-fill-17 0.2s cubic-bezier(0.39,0.575,0.565,1) 1s both}@-webkit-keyframes animate-svg-fill-18{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-18{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-18{-webkit-animation:animate-svg-fill-18 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.05s both;animation:animate-svg-fill-18 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.05s both}@-webkit-keyframes animate-svg-fill-19{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-19{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-19{-webkit-animation:animate-svg-fill-19 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.1s both;animation:animate-svg-fill-19 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.1s both}@-webkit-keyframes animate-svg-fill-20{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-20{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-20{-webkit-animation:animate-svg-fill-20 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.1500000000000001s both;animation:animate-svg-fill-20 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.1500000000000001s both}@-webkit-keyframes animate-svg-fill-21{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-21{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-21{-webkit-animation:animate-svg-fill-21 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.2s both;animation:animate-svg-fill-21 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.2s both}@-webkit-keyframes animate-svg-fill-22{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-22{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-22{-webkit-animation:animate-svg-fill-22 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.25s both;animation:animate-svg-fill-22 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.25s both}@-webkit-keyframes animate-svg-fill-23{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-23{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-23{-webkit-animation:animate-svg-fill-23 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.3s both;animation:animate-svg-fill-23 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.3s both}@-webkit-keyframes animate-svg-fill-24{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-24{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-24{-webkit-animation:animate-svg-fill-24 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.35s both;animation:animate-svg-fill-24 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.35s both}@-webkit-keyframes animate-svg-fill-25{0%{fill:transparent}100%{fill:rgb(255,255,255)}}@keyframes animate-svg-fill-25{0%{fill:transparent}100%{fill:rgb(255,255,255)}}.svg-elem-25{-webkit-animation:animate-svg-fill-25 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.4000000000000001s both;animation:animate-svg-fill-25 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.4000000000000001s both}@-webkit-keyframes animate-svg-fill-26{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-26{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-26{-webkit-animation:animate-svg-fill-26 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.45s both;animation:animate-svg-fill-26 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.45s both}@-webkit-keyframes animate-svg-fill-27{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-27{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-27{-webkit-animation:animate-svg-fill-27 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.5s both;animation:animate-svg-fill-27 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.5s both}@-webkit-keyframes animate-svg-fill-28{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-28{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-28{-webkit-animation:animate-svg-fill-28 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.55s both;animation:animate-svg-fill-28 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.55s both}@-webkit-keyframes animate-svg-fill-29{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-29{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-29{-webkit-animation:animate-svg-fill-29 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.6s both;animation:animate-svg-fill-29 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.6s both}@-webkit-keyframes animate-svg-fill-30{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-30{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-30{-webkit-animation:animate-svg-fill-30 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.6500000000000001s both;animation:animate-svg-fill-30 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.6500000000000001s both}@-webkit-keyframes animate-svg-fill-31{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-31{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-31{-webkit-animation:animate-svg-fill-31 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.7s both;animation:animate-svg-fill-31 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.7s both}@-webkit-keyframes animate-svg-fill-32{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-32{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-32{-webkit-animation:animate-svg-fill-32 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.75s both;animation:animate-svg-fill-32 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.75s both}@-webkit-keyframes animate-svg-fill-33{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-33{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-33{-webkit-animation:animate-svg-fill-33 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.8s both;animation:animate-svg-fill-33 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.8s both}@-webkit-keyframes animate-svg-fill-34{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-34{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-34{-webkit-animation:animate-svg-fill-34 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.85s both;animation:animate-svg-fill-34 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.85s both}@-webkit-keyframes animate-svg-fill-35{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-35{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-35{-webkit-animation:animate-svg-fill-35 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.9000000000000001s both;animation:animate-svg-fill-35 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.9000000000000001s both}@-webkit-keyframes animate-svg-fill-36{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-36{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-36{-webkit-animation:animate-svg-fill-36 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.95s both;animation:animate-svg-fill-36 0.2s cubic-bezier(0.39,0.575,0.565,1) 1.95s both}@-webkit-keyframes animate-svg-fill-37{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-37{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-37{-webkit-animation:animate-svg-fill-37 0.2s cubic-bezier(0.39,0.575,0.565,1) 2s both;animation:animate-svg-fill-37 0.2s cubic-bezier(0.39,0.575,0.565,1) 2s both}@-webkit-keyframes animate-svg-fill-38{0%{fill:transparent}100%{fill:rgb(112,160,138)}}@keyframes animate-svg-fill-38{0%{fill:transparent}100%{fill:rgb(112,160,138)}}.svg-elem-38{-webkit-animation:animate-svg-fill-38 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.0500000000000003s both;animation:animate-svg-fill-38 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.0500000000000003s both}@-webkit-keyframes animate-svg-fill-39{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-39{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-39{-webkit-animation:animate-svg-fill-39 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.1s both;animation:animate-svg-fill-39 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.1s both}@-webkit-keyframes animate-svg-fill-40{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-40{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-40{-webkit-animation:animate-svg-fill-40 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.1500000000000004s both;animation:animate-svg-fill-40 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.1500000000000004s both}@-webkit-keyframes animate-svg-fill-41{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-41{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-41{-webkit-animation:animate-svg-fill-41 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.2s both;animation:animate-svg-fill-41 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.2s both}@-webkit-keyframes animate-svg-fill-42{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-42{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-42{-webkit-animation:animate-svg-fill-42 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.2500000000000004s both;animation:animate-svg-fill-42 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.2500000000000004s both}@-webkit-keyframes animate-svg-fill-43{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-43{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-43{-webkit-animation:animate-svg-fill-43 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.3000000000000003s both;animation:animate-svg-fill-43 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.3000000000000003s both}@-webkit-keyframes animate-svg-fill-44{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-44{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-44{-webkit-animation:animate-svg-fill-44 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.35s both;animation:animate-svg-fill-44 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.35s both}@-webkit-keyframes animate-svg-fill-45{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-45{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-45{-webkit-animation:animate-svg-fill-45 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.4000000000000004s both;animation:animate-svg-fill-45 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.4000000000000004s both}@-webkit-keyframes animate-svg-fill-46{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-46{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-46{-webkit-animation:animate-svg-fill-46 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.45s both;animation:animate-svg-fill-46 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.45s both}@-webkit-keyframes animate-svg-fill-47{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-47{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-47{-webkit-animation:animate-svg-fill-47 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.5000000000000004s both;animation:animate-svg-fill-47 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.5000000000000004s both}@-webkit-keyframes animate-svg-fill-48{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-48{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-48{-webkit-animation:animate-svg-fill-48 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.5500000000000003s both;animation:animate-svg-fill-48 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.5500000000000003s both}@-webkit-keyframes animate-svg-fill-49{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-49{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-49{-webkit-animation:animate-svg-fill-49 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.6000000000000005s both;animation:animate-svg-fill-49 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.6000000000000005s both}@-webkit-keyframes animate-svg-fill-50{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-50{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-50{-webkit-animation:animate-svg-fill-50 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.6500000000000004s both;animation:animate-svg-fill-50 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.6500000000000004s both}@-webkit-keyframes animate-svg-fill-51{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-51{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-51{-webkit-animation:animate-svg-fill-51 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.7s both;animation:animate-svg-fill-51 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.7s both}@-webkit-keyframes animate-svg-fill-52{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-52{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-52{-webkit-animation:animate-svg-fill-52 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.7500000000000004s both;animation:animate-svg-fill-52 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.7500000000000004s both}@-webkit-keyframes animate-svg-fill-53{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-53{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-53{-webkit-animation:animate-svg-fill-53 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.8000000000000003s both;animation:animate-svg-fill-53 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.8000000000000003s both}@-webkit-keyframes animate-svg-fill-54{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-54{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-54{-webkit-animation:animate-svg-fill-54 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.8500000000000005s both;animation:animate-svg-fill-54 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.8500000000000005s both}@-webkit-keyframes animate-svg-fill-55{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-55{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-55{-webkit-animation:animate-svg-fill-55 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.9000000000000004s both;animation:animate-svg-fill-55 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.9000000000000004s both}@-webkit-keyframes animate-svg-fill-56{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-56{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-56{-webkit-animation:animate-svg-fill-56 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.95s both;animation:animate-svg-fill-56 0.2s cubic-bezier(0.39,0.575,0.565,1) 2.95s both}@-webkit-keyframes animate-svg-fill-57{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-57{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-57{-webkit-animation:animate-svg-fill-57 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.0000000000000004s both;animation:animate-svg-fill-57 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.0000000000000004s both}@-webkit-keyframes animate-svg-fill-58{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-58{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-58{-webkit-animation:animate-svg-fill-58 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.0500000000000003s both;animation:animate-svg-fill-58 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.0500000000000003s both}@-webkit-keyframes animate-svg-fill-59{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-59{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-59{-webkit-animation:animate-svg-fill-59 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.1000000000000005s both;animation:animate-svg-fill-59 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.1000000000000005s both}@-webkit-keyframes animate-svg-fill-60{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-60{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-60{-webkit-animation:animate-svg-fill-60 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.1500000000000004s both;animation:animate-svg-fill-60 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.1500000000000004s both}@-webkit-keyframes animate-svg-fill-61{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-61{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-61{-webkit-animation:animate-svg-fill-61 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.2s both;animation:animate-svg-fill-61 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.2s both}@-webkit-keyframes animate-svg-fill-62{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-62{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-62{-webkit-animation:animate-svg-fill-62 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.2500000000000004s both;animation:animate-svg-fill-62 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.2500000000000004s both}@-webkit-keyframes animate-svg-fill-63{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-63{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-63{-webkit-animation:animate-svg-fill-63 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.3000000000000003s both;animation:animate-svg-fill-63 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.3000000000000003s both}@-webkit-keyframes animate-svg-fill-64{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-64{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-64{-webkit-animation:animate-svg-fill-64 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.3500000000000005s both;animation:animate-svg-fill-64 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.3500000000000005s both}@-webkit-keyframes animate-svg-fill-65{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-65{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-65{-webkit-animation:animate-svg-fill-65 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.4000000000000004s both;animation:animate-svg-fill-65 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.4000000000000004s both}@-webkit-keyframes animate-svg-fill-66{0%{fill:transparent}100%{fill:rgb(0,0,0)}}@keyframes animate-svg-fill-66{0%{fill:transparent}100%{fill:rgb(0,0,0)}}.svg-elem-66{-webkit-animation:animate-svg-fill-66 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.45s both;animation:animate-svg-fill-66 0.2s cubic-bezier(0.39,0.575,0.565,1) 3.45s both}



 

/* Please ❤ this if you like it! */


@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&display=swap');


.section-center{
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  z-index: 6;
  text-align: center;
  transform: translateY(-50%);
}

#menu-icon:checked,
#menu-icon:not(:checked) {
  position: absolute;
  left: -9999px;
}

.menu-icon:checked + label,
.menu-icon:not(:checked) + label{
  position: fixed;
  top: 63px;
  right: 75px;
  display: block;
  width: 30px;
  height: 30px;
  padding: 0;
  margin: 0;
  cursor: pointer;
  z-index: 10;
}
.menu-icon:checked + label:before,
.menu-icon:not(:checked) + label:before{
  position: absolute;
  content: '';
  display: block;
  width: 30px;
  height: 20px;
  z-index: 20;
  top: 0;
  left: 0;
  border-top: 2px solid #ececee;
  border-bottom: 2px solid #ececee;
  transition: border-width 100ms 1500ms ease, 
              top 100ms 1600ms cubic-bezier(0.23, 1, 0.32, 1),
              height 100ms 1600ms cubic-bezier(0.23, 1, 0.32, 1), 
              background-color 200ms ease,
              transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
.menu-icon:checked + label:after,
.menu-icon:not(:checked) + label:after{
  position: absolute;
  content: '';
  display: block;
  width: 22px;
  height: 2px;
  z-index: 20;
  top: 10px;
  right: 4px;
  background-color: #ececee;
  margin-top: -1px;
  transition: width 100ms 1750ms ease, 
              right 100ms 1750ms ease,
              margin-top 100ms ease, 
              transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
.menu-icon:checked + label:before{
  top: 10px;
  transform: rotate(45deg);
  height: 2px;
  background-color: #ececee;
  border-width: 0;
  transition: border-width 100ms 340ms ease, 
              top 100ms 300ms cubic-bezier(0.23, 1, 0.32, 1),
              height 100ms 300ms cubic-bezier(0.23, 1, 0.32, 1), 
              background-color 200ms 500ms ease,
              transform 200ms 1700ms cubic-bezier(0.23, 1, 0.32, 1);
}
.menu-icon:checked + label:after{
  width: 30px;
  margin-top: 0;
  right: 0;
  transform: rotate(-45deg);
  transition: width 100ms ease,
              right 100ms ease,  
              margin-top 100ms 500ms ease, 
              transform 200ms 1700ms cubic-bezier(0.23, 1, 0.32, 1);
}

.nav{
  position: fixed;
  top: 33px;
  right: 50px;
  display: block;
  width: 80px;
  height: 80px;
  padding: 0;
  margin: 0;
  z-index: 9;
  overflow: hidden;
  
    background-color: #67a086;
  animation: border-transform 7s linear infinite;
  transition: top 350ms 1100ms cubic-bezier(0.23, 1, 0.32, 1),  
              right 350ms 1100ms cubic-bezier(0.23, 1, 0.32, 1),
              transform 250ms 1100ms ease,
              width 650ms 400ms cubic-bezier(0.23, 1, 0.32, 1),
              height 650ms 400ms cubic-bezier(0.23, 1, 0.32, 1);
}
@keyframes border-transform{
    0%,100% { border-radius: 63% 37% 54% 46% / 55% 48% 52% 45%; } 
  14% { border-radius: 40% 60% 54% 46% / 49% 60% 40% 51%; } 
  28% { border-radius: 54% 46% 38% 62% / 49% 70% 30% 51%; } 
  42% { border-radius: 61% 39% 55% 45% / 61% 38% 62% 39%; } 
  56% { border-radius: 61% 39% 67% 33% / 70% 50% 50% 30%; } 
  70% { border-radius: 50% 50% 34% 66% / 56% 68% 32% 44%; } 
  84% { border-radius: 46% 54% 50% 50% / 35% 61% 39% 65%; } 
}

.menu-icon:checked ~ .nav {
  animation-play-state: paused;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
  width: 200%;
  height: 200%;
  transition: top 350ms 700ms cubic-bezier(0.23, 1, 0.32, 1),  
              right 350ms 700ms cubic-bezier(0.23, 1, 0.32, 1),
              transform 250ms 700ms ease,
              width 750ms 1000ms cubic-bezier(0.23, 1, 0.32, 1),
              height 750ms 1000ms cubic-bezier(0.23, 1, 0.32, 1);
}

.nav ul{
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  z-index: 6;
  text-align: center;
  transform: translateY(-50%);
  list-style: none;
}
.nav ul li{
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  margin: 10px 0;
  text-align: center;
  list-style: none;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(30px);
  transition: all 250ms linear;
}
.nav ul li:nth-child(1){
  transition-delay: 200ms;
}
.nav ul li:nth-child(2){
  transition-delay: 150ms;
}
.nav ul li:nth-child(3){
  transition-delay: 100ms;
}
.nav ul li:nth-child(4){
  transition-delay: 50ms;
}
.nav ul li a{
  font-family: 'Montserrat', sans-serif;
  font-size: 9vh;
  text-transform: uppercase;
  line-height: 1.2;
  font-weight: 800;
  display: inline-block;
  position: relative;
  color: #ececee;
  transition: all 250ms linear;
  text-decoration: none;
}
.nav ul li a {
  transition: transform 0.3s ease, color 0.3s ease;
}

.nav ul li a:hover {
  transform: scale(1.1);
  color: #efffeb;
}
.nav ul li a:after{
  display: block;
  position: absolute;
  top: 50%;
  
  height: 2vh;
  margin-top: -1vh;
  width: 0;
  left: 0;
  background-color: #353746;
  opacity: 0.8;
  transition: width 250ms linear;
}
.nav ul li a:hover:after{
  width: 100%;
}

.menu-icon:checked ~ .nav  ul li {
  pointer-events: auto;
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  transition: opacity 350ms ease,
              transform 250ms ease;
}
.menu-icon:checked ~ .nav ul li:nth-child(1){
  transition-delay: 1400ms;
}
.menu-icon:checked ~ .nav ul li:nth-child(2){
  transition-delay: 1480ms;
}
.menu-icon:checked ~ .nav ul li:nth-child(3){
  transition-delay: 1560ms;
}
.menu-icon:checked ~ .nav ul li:nth-child(4){
  transition-delay: 1640ms;
}
.menu-icon:checked ~ .nav ul li:nth-child(5){
  transition-delay: 1740ms;
}
.menu-icon:checked ~ .nav ul li:nth-child(6){
  transition-delay: 1840ms;
}

.звездная-вертушка {
    height: 20em;
    overflow: hidden;
    display: flex;
    align-items: center;
}

.космическая-база {
    width: 100%;
    overflow: hidden;
    position: relative;
    display: flex;
}

/* Запускаем анимацию */
.летящее-созвездие {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 1em; /* расстояние между изображениями */
    animation: бесконечный-полет 20s linear infinite;
}

.летящее-созвездие img {
    height: auto; /* сохраняем пропорции */
    max-height: 20em;
    max-width: none;
    flex-shrink: 0;
    object-fit: cover;
}

@keyframes бесконечный-полет {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-100% / 3));
    }
}

.logo {
	position: absolute;
	top: 60px;
	left: 50px;
	display: block;
	z-index: 11;
	transition: all 250ms linear;
}
.logo img {
	height: 26px;
	width: auto;
	display: block;
}

@media screen and (max-width: 991px) {
  .menu-icon:checked + label,
  .menu-icon:not(:checked) + label{
    right: 55px;
  }
 
  .nav{
    right: 30px;
  }
 
  .nav ul li a{
    font-size: 6vh;
  }
}

.zapis {
  display:flex;

}

.btn {
  display: inline-block;
  margin: 2em auto;
  padding: 1em;
  background-color: #67a086;
  color: white;
  font-size: 2em;
  text-align: center;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  font-family: 'Montserrat';
    text-decoration: auto;
    font-weight: 700;
}

.btn:hover {
  background-color: #3d6e58;
}

/* Фон затемнения */
.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  animation: fadeIn 0.3s ease;
}

/* Модальное окно */
.popup {
  background: white;
  width: 90%;
  max-width: 500px;
  padding: 20px;
  border-radius: 8px;
  position: relative;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
  opacity: 0;
  transform: scale(0.9);
  animation: slideIn 0.3s ease forwards;
}

.popup-close {
  position: absolute;
  top: 10px;
  right: 10px;
  background: transparent;
  border: none;
  font-size: 18px;
  cursor: pointer;
}

/* Анимации */
@keyframes fadeIn {
  from {
    background: rgba(0, 0, 0, 0);
  }
  to {
    background: rgba(0, 0, 0, 0.5);
  }
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes slideOut {
  from {
    opacity: 1;
    transform: scale(1);
  }
  to {
    opacity: 0;
    transform: scale(0.9);
  }
}

@keyframes fadeOut {
  from {
    background: rgba(0, 0, 0, 0.5);
  }
  to {
    background: rgba(0, 0, 0, 0);
  }
}

@media screen and (max-width: 768px) {
  .btn{font-size: 1em;}
}

.mini_gallery {

  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  gap: 1em;
  padding: 1em;
  align-items: center;
  justify-content: center;
}


.microi {
  width: 12em; /* Устанавливает ширину контейнера div */
}

.microi img {
  width: 100%; /* Устанавливает ширину картинки на 100% от ширины родительского контейнера */
  height: auto; /* Сохраняет пропорции изображения */
}

.podrob {
  margin: 0em;
}

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

.miniinfo {
  font-size: 0.8rem;
}

.priceblock h3 {
  font-size: 2.5em;
}

.priceblock h3 {
  font-size: 2.5em;
  margin-block-end: 0em;
  margin-block-start: 0em;
}

@media screen and (max-width: 768px) {
  .priceblock h3 {
    font-size: 1.3em;
    margin-block-end: 0em;
    margin-block-start: 0em;
  }
 
}

.bigtext {

  display: flex;
    justify-content: center;
}

.bigtext ol {
  font-size: 1.5em;
}

.bigtext li {
  margin-bottom: 0.5em;
}

.stars {
display: flex;
    justify-content: flex-end;
  }

.stars img {
  width: 8em;

}

/* Устанавливаем базовые стили для формы */
#feedback-form {
  width: 100%;
  display: flex;
  flex-direction: column; /* Ставим элементы один под другим */
}

/* Стили для текста, полей ввода и текстовой области */
#feedback-form label {
  width: 100%; /* Ширина меток тоже 100% */

}

#feedback-form input,
#feedback-form textarea,
#feedback-form button {
  width: 100%; /* 100% ширина */
  box-sizing: border-box; /* Учет отступов внутри элемента */
  padding: 10px; /* Внутренний отступ для удобства ввода */
 
  font-size: 16px; /* Удобный размер текста */
  border: 1px solid #ccc; /* Граница для ввода */
  border-radius: 5px; /* Скругленные углы */
}

/* Стили для текстовой области */
#feedback-form textarea {
  resize: vertical; /* Разрешаем изменять размер текстовой области только по вертикали */
  height: 100px; /* Задаем начальную высоту */
}

/* Стили для кнопки "Отправить" */
#feedback-form button {
  background-color: #67a086;; /* Зеленый фон */
  color: white; /* Белый текст */
  border: none; /* Без рамок */
  cursor: pointer; /* Изменение курсора */
  font-weight: bold; /* Жирный текст */
  transition: background-color 0.3s; /* Плавный переход для фона */
}

#feedback-form button:hover {
  background-color: #45a049; /* Более темный зеленый при наведении */
}

 .button_hidden_anti {
      display: none;
      margin-top: 20px;
    }
/* Общий стиль контейнера */
.captcha-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  
  border: 1px solid #d3d3d3;
  border-radius: 6px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  background-color: #fff;
  width: 100%;
    margin-top: 1em;
  font-family: 'Roboto', Arial, sans-serif;
}

/* Скрытие стандартного чекбокса */
.captcha-checkbox {
  display: none;
}

/* Стилизованная галочка */
.captcha-label {
  display: flex;
  align-items: center;
  cursor: pointer;
  user-select: none;
  font-size: 16px;
  color: #202124;
  line-height: 1.5;
      margin: 1em;
}

.captcha-label .checkbox-icon {
  position: relative;
  width: 24px;
  height: 24px;
  border: 2px solid #d3d3d3;
  background-color: #fff;
  border-radius: 4px;
  margin-right: 10px;
  transition: all 0.3s ease;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Анимация галочки при отметке */
.captcha-checkbox:checked + .captcha-label .checkbox-icon {
  border-color: #4285f4;
  background-color: #4285f4;
  box-shadow: 0 4px 6px rgba(66, 133, 244, 0.4);
}

.captcha-checkbox:checked + .captcha-label .checkbox-icon::before {
  content: '';
  position: absolute;
      left: 8px;
    top: 4px;
  width: 6px;
  height: 12px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  animation: checkmark 0.3s ease forwards;
}

/* Анимация появления галочки */
@keyframes checkmark {
  from {
    transform: rotate(45deg) scale(0);
  }
  to {
    transform: rotate(45deg) scale(1);
  }
}

/* Сообщение об ошибке */
.info-message {
  margin-top: 15px;
  font-size: 14px;
  color: #e74c3c;
  display: none;
}

/* Показ сообщения об ошибке (если применить классы или логику через JS) */
.captcha-container.error .info-message {
  display: block;
}

.logo_captcha {
        font-size: 0.6em;
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    width: 98%;
    text-align: right;
    position: absolute;
    right: 8%;
    top: 91%;
    color: gray;
}

.mini_icon img {
    width:3em;
}

.mini_icon {
    display: flex;
    gap: 1em;
}

.big_im {
    display: flex;
    flex-direction: row;
    gap: 0.1em;
}

.big_im a {
    margin-right: 1em;
}

.big_im img {
    height: 21em;
    
}

@media screen and (max-width: 768px) {
  .big_im img {
    height: 7em;
}
}

.calendar {
    display: flex;
    justify-content: center;
    
}