@font-face {
    font-family: 'Deutsch Gothic';
    src: url('./fonts/ofont.ru_Deutsch\ Gothic.ttf')format('truetype');
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'CyrillicGoth', sans-serif;
    src: url("./fonts/ofont.ru_CyrillicGoth.ttf")format("woff");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'Kingthings_Petrock';
    src: url("./fonts/Kingthings_Petrock.ttf")format("woff");
    
}

@font-face {
  font-family: 'Montserrat-Light.ttf';
  src: url("./fonts/Montserrat-Light.ttf")format("ttf");
  
}
@font-face{font-family:'Neutral face';font-style:normal;font-weight:400;src:local('Neutral Face'),url(https://fonts.cdnfonts.com/s/83475/NeutralFace.woff) format('woff')}
@font-face{font-family:"Neutral face";font-style:normal;font-weight:700;src:local('Neutral Face'),url(https://fonts.cdnfonts.com/s/83475/NeutralFaceBold.woff) format('woff')}
@font-face{font-family:queen love stories free;font-style:normal;font-weight:400;src:local('Queen Love Stories free'),url('https://fonts.cdnfonts.com/s/92171/Queen Love Stories free.woff') format('woff')}
/* @import url('https://fonts.cdnfonts.com/css/queen-love-stories-free');
@import url('https://fonts.cdnfonts.com/css/futura-pt'); */
/* @import url('https://fonts.googleapis.com/css2?family=Commissioner:wght@100..900&display=swap'); */

:root {
    --container-width: 1440px;
    --sizeindex: calc(1vw + 1vh);
    --secondary:#191919;
    /* --family: 'MYRIADPRO', sans-serif;
        --font2: 'PT Serif', serif; */
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
a {
    text-decoration: none;
}
ul, ul li {
    list-style: none;
}
body {
    font-style: normal;
    font-weight: 400;
    color: #1A1A1A;
    font-size: 20px;
    position: relative;
}

img,
svg {
  display: block;
  width: 100%;
  height: auto;
}
.bone {
    width: 100%;
    max-width: 1400;
    margin: 0 auto;
    padding: 0 24px;
  color: #fff;
  }
.transparent {
    padding: 0 37px;   
}
.header__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* border-bottom: 1px solid #fff; */
}

 .header_wrap {
    padding: 5px 0 13px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    
}
.header_w {
    padding: 5px 0 13px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    
}
.head_menu>ul>li {
    display: inline-block;
    position: relative;
    line-height: 27px;
    margin-right: 25px; 
}
.head_menu>ul>li a {
    color: #fff;
    font-size: clamp(0.813rem, -0.271rem + 2.17vw, 1.625rem);
    font-family: "Kingthings_Petrock", sans-serif;
    cursor: pointer;
    letter-spacing: 0.6px !important;
}
/* .head_menu>ul>li a {
  color: #fff;
  font-size: 17px;
  
  
} */
.logo {
margin: 10px 0;
font-family: 'Deutsch Gothic', sans-serif;

letter-spacing: 1.3px;
color: #fff;
}
.logo a {
    color: #fff;
}
.logo h1 {
font-size: clamp(1.188rem, 0.662rem + 2.1vw, 2.5rem);
}
.nav {
  display: flex;
  flex-direction: column;
  gap: 18px;
  font-family: 'Deutsch Gothic', sans-serif;
    color: rgba(250, 250, 250, .9);
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
    padding: 0 37px;  
}
.nav-list__link {
    color: #e85858;
}
.nav-list__link--active {
color: #fff;
}
.nav__ru {
    color: #fff;
    margin-right: 5px; 
}
.nav__en {
    color: #e85858;
}
.lng_btn {
display: flex;
font-size: 18px;
cursor: pointer;
}
.foto__stella {
   position: absolute; 
   top: 105px;
   right: 65px;
   cursor: pointer;
transition: transform 0.3s ease;
}
/* .foto__stella img {
transition: filter 0.5s linear;
filter: brightness(2) grayscale(1) opacity(0.5);
}

.foto__stella img:hover {
    filter: none;
  } */
/* ****************  галереии ************************* */
.modal-content {
/* max-width: 100%; */
    margin: 0 auto;
    position: relative;
    padding: 0 10px;
}
.modal-content-img{

/* max-height: 750px;  */

object-fit: cover;          
object-position: center top;  
/* width: 100%;                */
 /* height: 100%; */
}
.h-100vh {
    height: 100vh;
}
.modal-overlay {
    position: relative;
}
.gallery__close-next {
  position: absolute;
    right: 35px;
     top: 25px;
   
    
}
.close-img {
    width: 45px;
    z-index: 200;
    right: 18px;
    margin-bottom: 5px;
        padding: 10px;
        border-radius: 5px;
        border: 1px solid #ffff;
        cursor: pointer; 
}
.nex-img {
    width: 45px;
   
    z-index: 200;
    right: 18px;
        padding: 10px;
        border-radius: 5px;
        border: 1px solid #ffff; 
        cursor: pointer;    
}
.nav__gall-landscape {
    cursor: pointer;
    transition: transform 0.3s ease;
    max-width: 330px;
    display: flex;
    gap: 15px;
}
.nav__gall-close {
    width: 30px;
}
.nav__gall-history{
cursor: pointer;
    transition: transform 0.3s ease;
    max-width: 330px;
    display: flex;
    gap: 15px;
}
.nav__gall-ruined {
    cursor: pointer;
    transition: transform 0.3s ease;
    max-width: 330px;
    display: flex;
    gap: 15px;   
}
.nav__gall-ruined:hover {
    transform: scale(1.1); 
}
.nav__gall-history:hover{
transform: scale(1.1);
}
.nav__gall-ruined a {
color: #fff;
}
.nav__gall-landscape:hover{
transform: scale(1.1);
}
.nav__gall-artem {
    cursor: pointer;
    transition: transform 0.3s ease;
    max-width: 330px;
    display: flex;
    gap: 15px;
}
.nav__gall-artem:hover{
transform: scale(1.1);
}

.gallery__artem{
    display: none;
}
.gallery__history {
    display: none;
}
.gallery {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
    align-items: center;
    height: 100%;
    width: 100%;
    top: 342px;
}
.galleryy {
   
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
    align-items: center;
    height: 100%;
    width: 100%;
    top: 342px;
}
.galleryyy {
    
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
    align-items: center;
    height: 100%;
    width: 100%;
    top: 342px;
}

.gallery img {
    height: auto;
    width: 160px;
    margin: 10px;
    border-width: 2px;
        border-style: solid;
        border-color: rgb(204, 204, 204);
        border-image: initial;
        padding: 5px;
    transition: .3s linear;
    cursor: pointer;
}
.gallery img:hover {
    transform: scale(1.1);
/* filter: drop-shadow(0 4px 8px rgba(0,0,0,0.2)) drop-shadow(0 12px 16px rgba(0,0,0,0.1)); */
};
.galleryy img:hover {
    transform: scale(1.1);
};
.galleryyy img:hover {
    transform: scale(1.1);
};
.galleryy img {
    height: auto;
    width: 160px;
    margin: 10px;
    border-width: 2px;
        border-style: solid;
        border-color: rgb(204, 204, 204);
        border-image: initial;
        padding: 5px;
    transition: .3s linear;
    cursor: pointer;
};
.galleryyy img {
    height: auto;
    width: 160px;
    margin: 10px;
    border-width: 2px;
        border-style: solid;
        border-color: rgb(204, 204, 204);
        border-image: initial;
        padding: 5px;
    transition: .3s linear;
    cursor: pointer;
}

.show img {
    opacity: .25;
    pointer-events: none;
}

.active {
    transition: box-shadow .5s linear .5s, top 1s ease-out, left 1s ease-out, transform 1s ease-out, width 1s ease-in, height 1s ease-in;
    box-shadow: 0 0 0 10px #fff;
    filter: drop-shadow(1px 2px 6px #000);
    pointer-events: none;
}

.close {
    position: relative;
    left: 100%;
    height: 20px;
    width: 20px;
    transform: translate(0%, -100%);
    border-radius: 50%;
    box-shadow: 0 0 0 2px #fff, 0 0 2px 2px #000;
    font: bold 20px/20px Arial;
    text-align: center;
    background-color: #000;
    color: #fff;
    pointer-events: auto;
    cursor: pointer;
    transition: 1s linear;
    opacity: 0;
}

.active .close:hover {
    transform: translate(0%, -100%) rotate(.5turn);
    transition: 1s ease;
}
.feedbackform_wrapper {
    gap: 15px;
    display: flex;
    padding: 15px 20px;
}
.feedbackform {
    padding: 10px 10px 20px 10px;
    display: flex;
    flex-direction: column;
    max-width: 603px;
    margin: 0 auto;
  }
  .feedbackform:hover {  
    background-color: rgba(0, 0, 0, 0.4);
    transition: all 0.3s ease; 
  }
  label {
    color: #fff;
    margin-top: 20px;
    font-family: 'Futura PT', sans-serif; 
    font-size: 16px;
  }
  
.feedback__form {
    width: 100%;
    color: #fff;
    padding: 5px;
    margin-top: 5px;
    background: none;
    border-bottom: 1px solid #fff !important;
    resize: none;
    border: none;
    font-size: 16px;
  }
  .feedback__area {
    font-size: 16px;
    width: 100%;
    color: #ddd;
    padding: 5px;
    margin-top: 5px;
    background: none;
    border-bottom: 1px solid #fff !important;
    resize: none;
    border: none;
    height: 54px;
}
  ::-webkit-input-placeholder { /* Для браузеров, основанных на WebKit, таких как Chrome и Safari */
    color: #fff; /* Цвет placeholder */
  }
  
  :-moz-placeholder { /* Для Firefox 18- */
    color: #fff; /* Цвет placeholder */
  }
  
  ::-moz-placeholder { /* Для Firefox 19+ */
    color: #fff; /* Цвет placeholder */
  }
  
  :-ms-input-placeholder { /* Для Internet Explorer */
    color: #fff; /* Цвет placeholder */
  }
  .button__form {
        padding: 0 22px;
        color: #fff;
        display: block;
        font-size: 13px;
        line-height: 43px;
        letter-spacing: 1.3px;
        /* -webkit-border-radius: 22px;
        border-radius: 22px; */
        border: 1px solid #fff;
        width: 80%;
        -webkit-transition: all .4s;
        -o-transition: all .4s;
        transition: all .4s;
        cursor: pointer;
        text-transform: uppercase;
        background-color: transparent;
        position: relative;
        margin: 25px auto 0;
        text-align: center;
  }
  .button__form:hover {
  background-color: rgba(255, 255, 255, 0.3);
  transition: all 0.3s ease; 
  }
.pm-generate {
    width: 20px;
}
.slide {
    max-width: 100%; 
    /* content: ""; */
        position: fixed;
        top: 0px;
        left: 0px;
        z-index: -1;
        width: 100vw;
        height: 100vh;
        object-fit: cover; /* Подобно backgroundSize: 'cover', чтобы изображение заполняло всю область */
        object-position: center;
        /* background-size: cover;
        background-repeat: no-repeat;
        background-position: center center; */
        height: -webkit-fill-available;
    }
    .feedback__container {
        position: relative;
        display: flex;
        justify-content: flex-start;
        gap: 90px;
        padding: 40px 200px 40px 40px;
    }
.feedback__contact {
 padding: 15px; 
color: #fff;
margin-top: 20px;
font-family: 'Futura PT', sans-serif;
background-color: rgba(0, 0, 0, 0.2);
}
.feedback__contact:hover {
    background-color: rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease; 
}
.feedback__contact p {
margin-bottom: 15px;
}
.feedback__close-button {
    position: absolute;
    top: 0;
    right: 0;
    width: 36px;
    font-size: 32px;
    margin: 20px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    background-color: #fff;
}  

.social {
    display: flex;
    column-gap: 30px;
    align-items: center;
    margin-bottom: 15px;
}
.map__google {
    text-align: center;
    margin-bottom: 20px;
}
.social__item-x {
    height: 30px;
    width: 30px;
    display: block; 
    background-size: cover;
    background-image:  url("data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e %3cpath d='M13.5222 10.7749L19.4785 4H18.0671L12.8952 9.88256L8.76437 4H4L10.2466 12.8955L4 20H5.41155L10.8732 13.7878L15.2356 20H20L13.5222 10.7749ZM11.5889 12.9738L10.956 12.0881L5.92015 5.03974H8.0882L12.1522 10.728L12.7851 11.6137L18.0677 19.0075H15.8997L11.5889 12.9738Z' fill='%23fff'/%3e %3c/svg%3e");
}
.proxy__link {
    max-width: 180px;
    display: block;
    padding: 9px;
    border: 1px solid;
    cursor: pointer;
    border-radius: 22px;
}
.proxy__link:hover {
    background-color: rgba(255, 255, 255, 0.3);
    transition: all 0.3s ease; 
}
.sponsor {
    padding: 10px;
    color: #fff;
    margin-top: 20px;
    font-family: 'Futura PT', sans-serif;
}
.sponsor:hover {
    background-color: rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease; 
}
.sponsor p {
    margin-bottom: 20px;
}
/* ****************** message ******************* */
#gratters-button {
    margin-top: 10px;
  }
  .input1 {
    display: block;
    max-width: 100%;
    min-height: 30px;
    opacity: 0.95;
    box-shadow: 0 11px 25px -4px rgba(0, 0, 0, 0.5), inset 0 -3px 4px -1px rgba(0, 0, 0, 0.2), 0 -10px 15px -1px rgba(255, 255, 255, 0.6), inset 0 3px 4px -1px rgba(255, 255, 255, 0.2), inset 0 0 5px 1px rgba(255, 255, 255, 0.8), inset 0 4px 30px 0 rgba(255, 255, 255, 0.2);
    /* border-radius: 4px; */
    opacity: 0.95;
    font-size: 16px;
    padding: 5px;
    border: 0;
    color: #fff;
    background: none;
    margin-bottom: 5px;
  }

  .message {
    max-width: 100%;
    /* min-height: 95px; */
    padding: 7px;
    box-shadow: 0 11px 25px -4px rgba(0, 0, 0, 0.5), inset 0 -3px 4px -1px rgba(0, 0, 0, 0.2), 0 -10px 15px -1px rgba(255, 255, 255, 0.6), inset 0 3px 4px -1px rgba(255, 255, 255, 0.2), inset 0 0 5px 1px rgba(255, 255, 255, 0.8), inset 0 4px 30px 0 rgba(255, 255, 255, 0.2);
    display: flex;
    /* background: #fff; */
    justify-content:space-between;
    opacity: 0.95;
    font-size: 14px;
    margin-bottom: 5px;
    align-items: center;
    background-color: #fff;
    color: #383737;
  }
 
  .list {
    max-height: 800px;
    overflow-y: scroll;
    box-shadow: 0 11px 25px -4px rgba(0, 0, 0, 0.5), inset 0 -3px 4px -1px rgba(0, 0, 0, 0.2), 0 -10px 15px -1px rgba(255, 255, 255, 0.6), inset 0 3px 4px -1px rgba(255, 255, 255, 0.2), inset 0 0 5px 1px rgba(255, 255, 255, 0.8), inset 0 4px 30px 0 rgba(255, 255, 255, 0.2);
    padding: 8px;
    /* border-radius: 6px; */
    margin-top: 5px;
  }

  .close-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 50px;
    box-shadow: 0 11px 25px -4px rgba(0, 0, 0, 0.5), inset 0 -3px 4px -1px rgba(0, 0, 0, 0.2), 0 -10px 15px -1px rgba(255, 255, 255, 0.6), inset 0 3px 4px -1px rgba(255, 255, 255, 0.2), inset 0 0 5px 1px rgba(255, 255, 255, 0.8), inset 0 4px 30px 0 rgba(255, 255, 255, 0.2);
    background: none;
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
  }
  .close-btn:hover {
    box-shadow: 0 11px 25px -4px rgba(0, 0, 0, 0.1), inset 0 -3px 4px -1px rgba(0, 0, 0, 0.1), 0 -10px 15px -1px rgba(255, 255, 255, 0.2), inset 0 3px 4px -1px rgba(255, 255, 255, 0.1), inset 0 0 5px 1px rgba(255, 255, 255, 0.8), inset 0 4px 30px 0 rgba(255, 255, 255, 0.1);
  }
  label {
    position: relative;
  }

  .gratters {
    position: relative;
    /* display: none; */
    /* top: 150px; */
    font-family: Arial, Helvetica, sans-serif;
    /* display: flex; */
    flex-direction: column;
    gap: 10px;
    max-width: 650px;
    padding: 20px;
    background: rgba(0, 0, 0, 0.3);
    /* background-color: rgb(255, 247, 240); */
    /* border-radius: 6px; */
    /* margin-left: 40px; */
    font-size: 16px;
  /* font-family: 'MYRIADPRO',sans-serif;  */
  color: #fff;
  }
  .gratters p {
   margin-bottom: 10px;
    
  }
  .gratters strong {
    font-family: 'Queen Love Stories free', sans-serif;
    
  }
    
  .check {
    padding: 2px;
    border: 1px solid #79797c;
    border-radius: 3px;
  }

  .remove {
    padding: 2px;
    border: 0;
    color: #fff;
    background: none;
    background: rgba(0, 0, 0, 0.1);
  }
  .publish-btn {
    padding: 5px;
    border: 0;
    color: #fff;
    background: none;
    box-shadow: 0 11px 25px -4px rgba(0, 0, 0, 0.5), inset 0 -3px 4px -1px rgba(0, 0, 0, 0.2), 0 -10px 15px -1px rgba(255, 255, 255, 0.6), inset 0 3px 4px -1px rgba(255, 255, 255, 0.2), inset 0 0 5px 1px rgba(255, 255, 255, 0.8), inset 0 4px 30px 0 rgba(255, 255, 255, 0.2);
    color: #fff;
    border: none;
    /* border-radius: 5px; */
    cursor: pointer;
  }
  /* ****************** end  message ******************* */

  .purpose {
    background: rgba(0, 0, 0, 0.05);
    padding: 20px 20px 0 20px;
  }
    @media (max-width: 1000px){
    .modal-content {
        width: inherit;
       
    }
    }
    @media (max-width: 900px){
        .feedback__container {
   
            gap: 25px;
    padding: 40px;
            justify-content: center;

        }
    }   
    @media (max-width: 700px){
    .feedback__container {
       
        /* justify-content: flex-start; */
        /* gap: 55px; */
        /* padding: 40px 200px 40px 40px; */
        flex-direction: column;
        align-items: center;
    }
    /* .logo h1 {
        font-size: 30px;
    } */
    .foto__stella {
        display: none;
}
    }
 @media (max-width: 600px){

 .transparent {
    padding: 0 25px;
}
/* .logo h1 {
    font-size: 25px;
} */
.lng_btn {
    font-size: 15px;
}
 }
@media (max-width: 480px){
    .head_menu>ul>li {
        margin-right: 20px;
    }
    .head_menu>ul>li a {
        font-size: 12px;
    }
    .logo {
      font-size: 16px;
        }
    /* .nav__new {
        font-size: 16px;
    } */
    .nav h2 {
        font-size: 15px;   
    }
    /* .main__wrapper {
        padding: 0 15px;
    } */
    .transparent {
        padding: 0 10px;
    }
    /* .logo h1 {
        font-size: 15px;
    } */
    .lng_btn {
        font-size: 13px;
    }
}
.purpose-p {
font-family: Arial, sans-serif; 
line-height: 1.35;
font-size: clamp(0.875rem, 0.665rem + 0.81vw, 1.375rem);
}
.purpose-h1 {
 opacity: 0; 
 display: flex;
  font-size: 14px;
}
.navbar {
padding: 0 37px; 
  color: #fff;  
}
hr {
    height: 1px;
    background: #ffffff;
    position: relative;
    overflow: hidden;
    border: none;
}        
hr:after {
    content: "";
    height: 1px;
    background: #4e4c4c;
    position: absolute;
    width: 14%;
    top: 0;
    animation: anim-hr 9s linear infinite;  
}
@keyframes anim-hr {
    0% {
        left: -20%;
    } 
    100% {
        left: 100%;
    }
}
/* ****************** transport  модальное окно ****************** */
.transport {
    font-family: 'Kingthings_Petrock';
} 
.transport-bg {
   background-image: url('/img/slav17.png');
   background-position: center center; 
   background-size: cover;
   background-repeat: no-repeat; 
   background-attachment: fixed;
}

.bone__transport {
    width: 100%;
    font-family: 'Kingthings_Petrock';
    margin: 0 auto;
  
    color: #fff;
}
.transport__bas {
    margin: 7px 0;
    display: flex;
    gap: 20px;
    font-family: 'Helvetica Neue';
    font-size: 20px;
}
.transport__ {
    background-position: center center; /* x y */
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    margin: 20px 15px;
    font-family: 'Helvetica Neue';
    height: 90vh;
}

.transport__bas1 {
    background-image: url('/img/transport/avtovok-front.png');
  
}
.transport__rel1 {
    background-image: url('/img/transport/railway2.jpg');
   
}
.transport__rel2 {
    background-image: url('/img/transport/svyatogorsk-rel-per.jpg');

}
.transport__bas2 {
    background-image: url('/img/transport/svyatogorsk-avtos.jpg');
 
}
.transport__bas3 {
    background-image: url('/img/transport/ukr.png');  
}
.transport__rel3 {
    background-image: url('/img/transport/railway.jpeg');
    
}
.transport__bas1-in {
position: absolute;
left: 20px;
bottom: 20px;
max-width: 624px;
height:auto;

}
.transport__rel1-in {
    position: absolute;
    left: 20px;
    top: 20px;
    max-width: 730px;
    height:auto;
}
.transport__rel2-for {
    position: absolute;
    left: 20px;
    bottom: 20px;
    max-width: 730px;
    height:auto;
}
.transport__bas1-for {
    position: absolute;
    left: 20px;
    top: 20px;
    max-width: 640px;
    height:auto;   
}
.transport__bas1-text {
    position: absolute;
    left: 20px;
    top: 20px;
    width: 50%;
    height:auto;    
}
.transport__rel3-text {
    position: absolute;
    left: 30px;
    bottom: 30px;
    width: 50%;
        
}
.transport__logo-h-a{
    font-size: clamp(1.625rem, 0.925rem + 2.8vw, 3.375rem)!important;
    font-family: 'Kingthings Petrock';
    color: #fff;
    text-shadow: 2px 2px 2px black;
}
.width-text {
    font-weight: 700;
    font-size: 22px;
    color: #0000007a;
    text-shadow: 2px 2px 2px black;
}
.transport__text {
    font-weight: 700;
    font-size: 34px;
    margin-left: 20px; 
    text-shadow: 2px 2px 2px black; 
}
.transport__text-905 {
    font-weight: 700;
    font-size: clamp(1.313rem, 0.919rem + 1.52vw, 2.25rem); 
    margin-left: 20px;   
    text-shadow: 2px 2px 2px black;
}
.width-text-905 {
display: flex;
align-items: center;
text-shadow: 2px 2px 2px black;
}
.width-text-905 p {
   font-size: clamp(1.25rem, 1.05rem + 0.8vw, 1.75rem);
     margin: 0 20px;
     text-shadow: 2px 2px 2px black;
}
.transport__img {
width: 50px;
}
.transport__tx-hed {
font-size: clamp(1.375rem, 1.025rem + 1.4vw, 2.25rem);
padding: 0 20px;
}
.transport__tx {
font-size: clamp(1rem, 1rem + 1.2vw, 1.75rem);
padding: 20px;
font-family: "Kingthings_Petrock",  sans-serif;
text-shadow: 2px 2px 2px black;
}
/* ****************** end  модальное окно ****************** */
/* ****************** гамбургер   ****************** */
.hamburger-menu {
    position: relative;
    display: none;
  }
  
  .hamburger {
    cursor: pointer;
    width: 30px;
    height: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  
  .hamburger .bar {
    height: 4px;
    width: 100%;
    background-color: #fff;
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
  
  .hamburger.open .bar:nth-child(1) {
    transform: translateY(10px) rotate(45deg);
  }
  
  .hamburger.open .bar:nth-child(2) {
    opacity: 0;
  }
  
  .hamburger.open .bar:nth-child(3) {
    transform: translateY(-10px) rotate(-45deg);
  }
  
  .menu {
    position: absolute;
    top: 56px;
    right: 0;
    width: 200px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.3);
    background-color: rgba(0, 0, 0, 0.2);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-20px);
    transition: transform 0.3s ease, opacity 0.3s ease, visibility 0.3s ease, all 0.3s ease ;
  }
  
  .menu.open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  
  .menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .menu ul li {
    border-bottom: 1px solid #ddd;
  }
  
  .menu ul li a {
    display: block;
    padding: 10px;
    color: #fff;
    text-decoration: none;
    font-style: italic;
  }
  .menu ul li .lng_btn {
    display: flex;
  }
  .menu ul li summary h1{
    display: block;
 
    color: #333;
    text-decoration: none;
    font-size: 20px!important;
    font-family: 'Queen Love Stories free', sans-serif;
  }
  /* .menu ul li a:hover {
    background-color: #f0f0f0;
  } */


/* *********************II twiter******************* */
.twittooitem__conteiner {
    height: 282px;
    border-radius: 34px;
}
.twittooitem__conteiner-get {
    height: 67vh;
    border-radius: 34px;
}
.twittooitem__element {
    height: 10px;
    width: 182px;
    margin: 0 auto;
    padding: 0 10px;
    color: #ddd;
    background: #000;
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px;
}
.twittooitem-get {
border: 7px solid #000;
border-radius: 45px;
margin: 0 auto;
background-color: rgba(0, 0, 0, 0.2);
}
.twittooitem {
border: 7px solid rgb(42, 42, 42);
border-radius: 45px;
margin: 0 auto;
background-color: rgba(0, 0, 0, 0.2);
}
.twittooitem__conteiner-wrappertoo-stela img {
    border-radius: 50%;
    width: 50px;
    position: relative;
    /* bottom: 42px; */
    height: 50px;
}
.twitfistitem__conteiner-wrappertoo-logo {
    color: #ddd;
    font-size: 15px;
    font-family: 'Arial', sans-serif ;

}
.twittooitem__conteiner-wrappertoo {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px;
}
.sending_message {
    max-width: 38vw;
}
.twitfistitem__conteiner-messagetoo {
    max-width: 60vw;
   padding: 0 15px; 
   font-family: 'Arial', sans-serif ;
}
.twitfistitem__conteiner-messagetoo li{
  color: #ffffff;
font-size: 16px;
border-bottom: 1px solid #fff;
border-top: 1px solid #fff; 
margin-bottom: 5px;
background-color: rgba(0, 0, 0, 0.2);
padding: 7px 0;
}


.founder__btn_heder {
    font-family: 'Arial', sans-serif;
    cursor: pointer;
    font-size: 14px;
    background: #fff;
    border: 1px solid #dee0e1;
    border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
    padding: 8px 5px 7px 8px;
   }
   .founder__btn_heder:hover {
       background:  #dee0e1;
      }
      .founder__btn_footer:hover  {
       background:  #dee0e1;
      }
   .founder__btn {
       display: flex;
       align-items: center;
       margin-top: 17px; 
   }
   .founder__reboot {
       margin-left: 30px;
       cursor: pointer;
       display: flex;
   }
   .founder__btn_footer {
       cursor: pointer;
       background: #fff;
       border: 1px solid #dee0e1;
       border-bottom-right-radius: 20px;
       border-top-right-radius: 20px;
       padding: 5px 9px 6px 5px;   
   }
   .founder__comments {
    font-family: 'Arial', sans-serif;
    margin-left: 20px;
    cursor: pointer;
    display: flex;
    font-size: 18px;
    color: #fff;
    padding: 6px 9px; 
    align-items: center;
   }
   .founder__comments:hover {
       background: rgba(255, 255, 255, 0.627);
   
       border-radius: 20px;
      }
    .bone__project {
        color: #fff;
    }  
      .project1 {
        background-image: url('/img/project/forest.jpg');
        /* background-image: url('/img/project/slav2.png'); */
      }
    .project {
        background-position: center center ; /* x y */
        background-size: cover;
        background-repeat: no-repeat;
        position: relative;
         margin-bottom: 20px;
        font-family: 'Helvetica Neue';
        height: 100vh;
      }
      .project__text {
        position: absolute;
        left: 20px;
        bottom: 20px;
        padding: 0 15px;
        background-color: rgba(0, 0, 0, 0.2);
      }
      .project2 {
        background-image: url('/img/project/orlenok-Svyatogorsk.jpg');
      }
    
      .project3 {
        background-image: url('/img/project/lager.jpg');
      }
     
      .project4 {
        background-image: url('/img/project/shahter.jpg');
      }
    
      .project5 {
        background-image: url('/img/project/lechebniza.jpg');
      }
     
      .project6 {
        background-image: url('/img/project/most.png');
      }
     
      .project7 {
        background-image: url('/img/project/float-svyt.jpg');
        background-position: center top!important; 
      }
    
      .project8 {
        background-image: url('/img/project/shokoladjpg.jpg');
      }
   
      .project__h1 {
        font-family: 'Kingthings_Petrock';
        font-size: clamp(1.5rem, 0.85rem + 2.6vw, 3.125rem);
        color: #fff;
        padding-left: 20px;
      }
      .feedback__link {
        max-width: 38vw;
        padding: 20px;
        margin-top: 15px;
        color: #fff;
        font-family: 'Helvetica Neue';
        background-color: rgba(0, 0, 0, 0.2);
      }
      .feedback__link-a{
        color: #fff;
        font-family: 'Helvetica Neue';
      } 
      .dropdown__infrostr-menu {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
      }
      
      .dropdown__infrostr-menu-item {
        position: relative;
      }
      
      /* .dropdown__infrostr-menu-link:hover {
        background-color: #f0f0f0;
      } */
      
      .dropdown__infrostr-list {
        position: absolute;
        top: 100%;
        left: 0;
        list-style: none;
        margin: 0;
        padding: 0;
        /* background-color: #fff; */
        /* border: 1px solid #ccc; */
        display: block;
        z-index: 1000;
        min-width: 250px;
      }
      
      .dropdown__infrostr-item {
        margin: 0;
         border-bottom: none!important;
      }
      
      .dropdown__infrostr-link {
        display: block;
        padding: 10px 0;
        color: #fff;
        text-decoration: none;
        font-style: italic;
       
      }
      .infrastructure {
        /* width: 100%; */
      max-width: 1440px;
      margin: 0 auto;
      padding: 0 15px;
      color: #fff;
      }
      .infrastructure__ {
        margin-bottom: 15px;
      }
    
      /* .infrastructure__header {
        display: block;
        height: 55px; 
       
        background-position: center center; 
        background-size: cover;
        background-repeat: no-repeat;
        margin: 130px 15px 15px;
       
        position: relative;
       
      } */
      
      .infrastructure__header-top {
        background-image: url('/img/infrastructura/heder-magaz.png');
        padding: 20px 20px 0 20px;
        font-size: 20px;
        font-family: 'Deutsch Gothic';
        color: #fff;
        max-width: 1440px;
        margin: 0 15px 10px;
        padding: 0 15px;
      }
      .magaziny__header-top {
        padding: 20px 20px 0 20px;
        font-size: 20px;
        font-family: 'Deutsch Gothic';
        color: #fff;
        /* max-width: 1440px;
        margin: 0 15px 10px;
        padding: 0 15px; */
      }

      .infrastructure__nav-a {
        padding: 20px 0;
        text-shadow: 2px 2px 2px black;
        color: #fff;
        display: block;
      }
      .kylttovar {
       position: relative;
      }
      .infrastructure__header-h1 {
        text-shadow: 2px 2px 2px black;
        font-size: clamp(1.188rem, 0.662rem + 2.1vw, 2.5rem);
        color: #fff;
        position: relative;
        font-family: 'Deutsch Gothic'; 
      }
      .desktop {
        display: block;
      }
      .mobil {
        display: none; 
      }
      .oshad {
        position: relative;
      }
    .infrastructure__oshad-text {
        position: absolute;
        left: 30%;
        top: 50%;
        transform: translate(-50%, -50%);
        font-family: 'Kingthings_Petrock';
        color: #fff;
        font-size: 23px;
    }
    .custom_photos__header {
      /* display: block; */
      /* height: 655px;  */
    
      /* background-position: center center; 
      background-size: cover;
      background-repeat: no-repeat; */
      margin-bottom: 30px; 
      color: #fff;
      position: relative;
      font-family: 'Deutsch Gothic'; 
      text-shadow: 2px 2px 2px black;
    }
    .custom_photos__body {
      background-image: url('/img/nik.jpg');
      background-position: center center; 
      background-size: cover;
      background-repeat: no-repeat; 
      background-attachment: fixed;
      /* position: fixed; */
      /* left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background-color: #1f3149;
      background-size: cover;
      background-repeat: no-repeat;
      background-position: 50%;
      z-index: -1;  */
    }
    .custom-file-input {
      display: none;
  }
.photos__text-footer {
  max-width: 600px;
  text-align: center;
  margin: 0 auto;
  color: #fff;
  font-family: "PT Sans", sans-serif;
}
.photos__text-header {
  max-width: 740px;
  text-align: center;
  margin: 15px auto 0;
  color: #fff;
font-size: 25px;
  font-family: "PT Sans", sans-serif;
  text-shadow: 2px 2px 2px black;
  padding: 0 13px;
}
.photos__text-requirements {
  max-width: 620px;
  margin: 10px auto 0;
  color: #fff;
  font-size: 15px;
  padding: 0 13px;
}  
.form__text-error {
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 3px;
  font-size: 13px;
  line-height: 21px;
  font-weight: 500;
  color: #fd576c;
}

.form__text-error p {
  color: #fd576c;
}
.form__text-error span {
  display: block;
  width: 15px;
  height: 15px;
  margin-right: 7px;
  padding-top: 2px;
  padding-left: 6px;
  font-size: 15px;
  line-height: 12px;
  color: #fff;
  border-radius: 50%;
  background-color: #fd7386;
}
.photos__input-desc {
  font-size: 16px;
  width: 100%;
  color: #ddd;
  padding: 5px;
  margin-top: 5px;
  background: none;
  border-bottom: 1px solid #fff !important;
  border: none;
  height: 35px;
}
.showvideo__ {
 margin: 0 auto;
 display: flex;
 gap: 10px;
 max-width: 11240px;
 justify-content: center;
 flex-wrap: wrap;
}

.showvideo__img {
  max-width: max-content;
  padding: 10px 10px 10px 10px;
  background-color: rgba(225, 255, 255, 0.3);
  color: #fff;
  font-size: 16px;
  border-radius: 10px;
}
.__img {
 width: 300px;
  height: 300px;
}
.__img img{
  width: 100%;
  height: 100%;
  object-fit: cover; 
  border-radius: 10px;
  /* object-position: center right; */
}
.showvideo__h1 {
  font-size: 25px;
  text-align: center;
  color: #fff;
  font-weight: 500;
  padding: 10px;
  background-color: rgba(225, 255, 255, 0.3);
  max-width: 429px;
  margin: 0 auto 15px;
  border-radius: 10px;
}
.mysvyatogorsk__content {
  max-width: 1140px;
  padding: 20px;
  background-color: rgba(255, 255, 255);
  color: rgb(20 20 20 / 77%);;
  letter-spacing: 1.1px;
  line-height: 32px;
  font-size: 24px;
  text-align: justify;
  font-family: "PT Sans", sans-serif;
  font-weight: 500;
}
.mysvyatogorsk__content p{
margin-bottom: 11px;
}
  @media (max-width: 800px){
    .hamburger-menu {
     display: block;
      }
      .header_wrap {
    display: none;
      }
      .lng_btn {
        display: none;
    
    }
    .dropdown__infrostr-list {
        left: -130px;
        top: -13px;
    }

.menu {
    right: 807%;
  }
}
@media (max-width: 700px){
    .menu {
        right: 0;
    }
    .feedbackform_wrapper {
        flex-direction: column;
        align-items: center;
    }
    .sending_message {
         max-width: 100%; 
    }
    .twitfistitem__conteiner-messagetoo {
        max-width: 100%;
    }
    th, td {
        padding: 0;
       font-size: 14px;
      }
      .transport__rel2-for {
      left: 0;
    }
    .transport__bas1-in {
        left: 0;
    }
    .transport__rel1-in {
        left: 0px;
    }
    .transport__bas1-for {
        left: 0px;
    } 
    .feedback__link {
        max-width: 79vw;
    }
      }   
  @media (max-width: 480px){
    .desktop {
        display: none;
      }
      .mobil {
        display: block; 
      } 
      .infrastructure__header {
        background-image: url('/img/infrastructura/treshka-mobil.jpg');
    }
  .hamburger {
    width: 22px;
    height: 22px;
  }
  .hamburger .bar {
    height: 2px;
  }
 
.width-text-905 {
    font-size: 20px;
}
.transport__rel3-text {
    font-size: 16px;
}

.transport__rel1-in {
    font-size: 16px; 
}
.transport__text {
    font-size: 20px;
}
.project {
    height: 50vh;
  }
  .transport__ {
    height: 50vh;
  }  

}
@media (max-width: 430px) {
    .css-modal-details details[open] .cmc {
        left: -159px;
    }
}
@media (max-width: 414px) {
    .css-modal-details details[open] .cmc {
        left: -147px;
    }
}
@media (max-width: 390px) {
    .css-modal-details details[open] .cmc {
        left: -118px;
    }
}

@media (max-width: 375px) {
    .css-modal-details details[open] .cmc {
        left: -104px;
    }
}
/* ****************** бургер  end ****************** */
/* .bg {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #1f3149;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50%;
  z-index: -1;
} */