


body{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    overflow-x: hidden;
    font-family: 'Helvetica Neue';
}
.header__mobile, .swiper__mobile, .aboutRent__mobile, .capnews__mobile, .galeryinfo_mobile, .footer__mobile{
    display: none;
}

.bordernone{
    text-decoration: none;
}




/* ---------------------------------иконки в хедере------------------------------ */
.activeicon{
    
    transition: fill 0.3s ease-in-out;
}

.map:hover .activeicon {
    fill: #FCF283;
}

.location:hover .activeicon{
    fill: #FCF283;
}
/* ---------------------------------иконки в хедере------------------------------ */

/* ---------------------------------Форма для связи------------------------ */
.blacktext{
    color: #000;
    
}

.whitetext{
    color: #FFF;
    
}
.hel{
    font-family: 'Helvetica Neue', sans-serif;
}

.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.overlay.active {
    overflow: hidden;
}



.contact-form {
    width: 80%;
    max-width: 20%;
    margin: auto;
    padding: 1vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 0.5vw;
    background: #FEFEFE;
    box-shadow: 0px 4px 4px 0px rgba(227, 227, 227, 0.25);
    overflow-y: auto;
}

.form-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1vw;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0.48px;
    margin-bottom: 1vw;
}

.form-line {
    margin-bottom: 0.9vw;
}

.form-input {
    width: 100%;
    border-radius: 30px;
    border: 1px solid #B4B1B1;
    color: #000;
    font-size: 0.7vw;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0.3px;
    padding:0.7vw;
    box-sizing: border-box;
    position: relative;
    appearance: none;
    -webkit-appearance: none;
    background-size: 20px; 
    cursor: pointer;
}

.form-input::-ms-expand {
    display: none;
}

.form-input:focus {
    outline: none;
}

.form-input-with-button {
    display: flex;
    align-items: center;
}

.form-button {
    cursor: pointer;
    width: 0.6vw;
    height: 1.3vw;
    background: url('./assets/images/arrows.svg') no-repeat center center;
    background-size: cover;
    border: none;
    z-index: 5;
    margin-left: -1.5vw; 
    pointer-events: none;
}

.submit-button {
    font-size: 1vw;
    font-weight: 500;
    line-height: normal;
    border-radius: 0.3vw;
    background: #102D4A;
    width: 100%;
    height: 2vw;
    border: none;
    margin-top: 1.2vw;
    align-items: center;
    justify-content: center;
    font-family: 'Helvetica Neue';
    font-weight: 600;
}

.galbut{
    font-size: 0.9vw;
    border-radius: 0.3vw;
    width: 70%;
    height: 2vw;
    margin-top: 1.2vw;
    
}

.submit-button-container {
    opacity: 0.5;
    pointer-events: none;
    border: none;
    background: transparent;
    width: 100%;
}
.submit-button-container.active {
    opacity: 1;
    pointer-events: auto;
}

#privacyPolicyCheckbox {
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 1vw;
    height: 1vw;
    border-radius: 50%; 
    border: 0.1vw solid #999; 
    outline: none;
    cursor: pointer;
}

#privacyPolicyCheckbox::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0.4vw;
    height: 0.4vw;
    background-color: #999; 
    border-radius: 50%; 
    opacity: 0; 
}

#privacyPolicyCheckbox:checked::before {
    opacity: 1; 
}
#privacyPolicyCheckbox2 {
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 1vw;
    height: 1vw;
    border-radius: 50%; 
    border: 0.1vw solid #999; 
    outline: none;
    cursor: pointer;
}

#privacyPolicyCheckbox2::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0.4vw;
    height: 0.4vw;
    background-color: #999; 
    border-radius: 50%; 
    opacity: 0; 
}

#privacyPolicyCheckbox2:checked::before {
    opacity: 1; 
}

/* -------------------------------------------------------------------------------- */



.header__mobile{
    display: none;
}
/* --------------------------general styles---------------------------------- */
.poitner{
    cursor: pointer;
}
.h640{
    height: 640;
}
.tx{
    color: #FFF;
    font-style: normal;
}
.flex{
    display: flex;
}
.center{
    margin: 0 auto;

}
.decornone{
    text-decoration: none;
}
.dcenter{
    display: flex;
    justify-content: center;

}

.w-100{
    width: 100%;
}

.alitc{
    align-items: center;
}
.w-1440{
    width: 75%;
    margin: 0 auto;
}
.w-1650{
    width: 85.9375%;
    margin: 0 auto;
}
.w-50{
    width: 50%;
}

.column{
    display: flex;
    flex-direction: column;
}

.imsnews:nth-child(1) {
    background: url("./assets/images/lowerfirstsvg.png");
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
    background-position: center;
    
}

.imsnews:nth-child(2) {
    background: url("./assets/images/lowersecond.png");
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
    background-position: center;
    
}

.imsnews:nth-child(3) {
    background: url("./assets/images/lowerfirstsvg.png");
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
    background-position: center;
    
}

.imsnews {
    width: 100%; 
    aspect-ratio: 16/9; 
   
}

/* --------------------------------------------------------------------------------------------------------- */

/* ----------------------------------header start--------------------------------------------- */


.header__and__video{
    /* position: relative; */
    height: 100vh;
    display: flex;
    flex-direction: column;

}
.header__desktop{
    height: 100%;
    justify-content: center;
    display: flex;
    background: rgba(39, 42, 49, 0.657);
    
}
.header__desktop__wrapper {
    position: relative;
    width: 100%;
   
}

.header__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1; 

}


.header__firstline{
    justify-content: space-between;
    align-items: center;
    margin-top: 44px;
}

.logo{
    margin-left: -7vw;
    width: 10vw;
}

.worktime__icon{
    width: 2vw;
    object-fit: cover;
}
.number__icon{
    width: 1.2vw;
    object-fit: cover;
}
.worktime__icon img, .number__icon img, .logo img{
    width: 100%;
    height: 100%;
}
.worktime__number{
    color: rgba(255, 255, 255, 0.80);
    font-size: 1vw;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.worktime, .number{
    gap: 0.7vw;
}
.worktime__number{
    gap: 3vw;
    align-items: center;
}
.map__location__tuor{
    /* gap: 3vw; */
    width: 10vw;
    align-items: center;
}
.map__location__tuor{
    justify-content: space-between;
    gap: 60px;
}

.location, .map{
    width: 2vw;
    object-fit: cover;
}

.location svg, .map svg{
    width: 100%;
    height: 100%;
}
/* ------------------------------tuor button-------------------------- */
.tuor__btn {
    width: 180px;
    height: 46px;
    justify-content: center;
    gap: 12px;
    border-radius: 5px;
    background: linear-gradient(180deg, #743D7E 35.94%, #502E75 100%);
    transition: filter 0.3s ease;
    display: none;
}

.tuor__btn:hover {
    filter: brightness(1.2); 
}

.tuor__text{
    font-size: 1.1vw;
    font-weight: 500;
    line-height: normal;
}
/* --------------------------------------------------------------------- */

.header__secondline{
    justify-content: space-between;
    margin-top: 3vw;
}
/* -----------------------------------------header links----------------------------- */
.links {
    position: relative;
    font-size: 1.1vw;
    font-weight: 500;
    line-height: normal;
    transition: color 0.3s ease; 
    display: inline-block;
    cursor: pointer;
    overflow: hidden;
    padding-bottom: 2px;
}
.renta {
    position: relative;
    font-size: 1vw;
    font-weight: 500;
    line-height: normal;
    transition: color 0.3s ease; 
    display: flex;
    cursor: pointer;
    overflow: hidden;
    padding-bottom: 0.1vw;
    width: 12vw;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
    

}

.links::before,
.links::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 0.05vw; 
    background-color: #FFF; 
    transition: width 0.5s ease, left 0.5s ease; 
}

.renta::before,
.renta::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 0.07vw; 
    opacity: 0.7;
    background-color: #000000; 
    transition: width 0.5s ease, left 0.5s ease; 
}
.links::before {
    transform: translateX(-50%);
}

.links::after {
    transform: translateX(50%);
}

.renta::before {
    transform: translateX(-50%);
    opacity: 0.3;
}

.renta::after {
    transform: translateX(50%);
    opacity: 0.3;
}

.links:hover::before,
.links:hover::after {
    width: 100%; 
    left: 0;
}

.renta:hover::before,
.renta:hover::after {
    width: 10vw;
    left: 0;
}
/* --------------------------------------------------------------------- */

.main__firstline{
    flex-direction: column;
    width: 75%;
    margin: 0 auto;
    display: flex;
    gap: 2vw;
    z-index: 4;
    
}

.companyname{
    font-family: "Systopie";
    font-size: 3.5vw;
    font-weight: 700;
    letter-spacing: 1.2px;
}

.info{
    font-family: "Systopie";
    font-size: 1.5vw;
    font-weight: 400;
    letter-spacing: 0.52px;
}

.rent__btn {
    
    padding-top:0.8vw;
    padding-bottom:0.8vw;
    padding-left: 1.2vw;
    padding-right: 1.2vw;
    border-radius: 0.3vw;
    background: linear-gradient(180deg, #DC8F43 0%, #CB5437 100%);
    font-size: 1.3vw;
    font-weight: 500;
    line-height: normal;
    align-items: center;
    cursor: pointer;
    z-index: 2;
    transition: filter 0.3s ease; 
    font-family: 'Helvetica Neue';
    display: flex;
    justify-content: center;
}

.rent__btn:hover {
    filter: brightness(1.1); 
}
/* ----------------------------------header end--------------------------------------------- */

.mainfirst{
    position: absolute;
    bottom: 0;
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0 auto;
    gap: 5vw;
    padding-bottom: 10vw;
    
   
}

.main__secondline{
    justify-content: right  ;
    width: 75%;
    margin: 0 auto;
}

.nullsecond{
    display: flex;
}
.aboutRent__wrapper{
    background: rgba(228, 223, 231, 0.30);
    
    /* padding-top: 200px;
    padding-bottom: 121px; */
    padding-top: 7vw;
    padding-bottom: 7vw;
    align-items: center;
    
    display: flex;
    
    
}

.aboutRent{
    justify-content: center;
    gap: 5vw;
}

.moreBtn{
   justify-content: space-between; 
   align-items: center;
}
/* ----------------------------------------button with arrow-------------------------- */
.moreBtnBtn:hover{
    filter: brightness(1.1);
}
.moreBtnBtn:hover .arrow{
    transform: translateX(1vw);
}
.moreBtnBtnnews:hover .arrow{
    transform: translateX(1vw);
}

.arrow {
    transition: transform 0.5s ease;
}

.moreBtnBtn {
    /* width: 268px;
    height: 80px; */
    padding-top:1vw;
    padding-bottom:1vw;
    padding-left: 2vw;
    padding-right: 2vw;
    border-radius: 0.3vw;
    border-radius: 0.2vw;
    background: linear-gradient(180deg, #A7C4DC 0%, #102D4A 100%);
    cursor: pointer;
    align-items: center;
    justify-content: center;
    gap: 1vw;
    margin-left: 40px;
    transition: filter 0.3s ease; 
    
}
.moreBtnBtnnews{
    width: 14%;
    padding-top:1.5vw;
    padding-bottom:1.5vw;
    padding-left: 2vw;
    padding-right: 2vw;
    border-radius: 0.3vw;
    border-radius: 0.2vw;
    background: linear-gradient(180deg, #A7C4DC 0%, #102D4A 100%);
    cursor: pointer;
    align-items: center;
    justify-content: center;
    gap: 1vw;
    margin-left: 40px;
    transition: filter 0.3s ease; 
}

/* --------------------------------------------------------------------- */

.RentImg {
    overflow: hidden; /* скрываем выход изображения за границы родительского элемента */
    position: relative; /* устанавливаем позиционирование для использования внутренних элементов */
    object-fit: cover;
    width: 50%;
}
.RentImg img{
    width: 100%;
    
}

.RentImg:hover .RentImg__imgloop {
    transform: scale(1.1); /* увеличиваем изображение на 10% при наведении */
    transition: transform 0.5s ease; /* добавляем плавный переход для эффекта приближения */
}

.RentImg__imgloop {
    width: 100%;
    height: 100%;
    object-fit: cover; /* сохраняем пропорции изображения */
    transition: transform 0.5s ease; /* добавляем плавный переход для изображения */
}








.RentImg__img{
    width: 100%;
    height: 100%;
}
.RentImg__mobile{
   object-fit: cover;
   
}


.morebtntext {
    color: #FFF;
    font-size: 1.2vw;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    
}


.infoAndBtn{
    flex-direction: column;
    justify-content: space-between;
    width: 50%;
    
}
.rentText{
    font-family: 'Systopie';
    font-size: 1.8vw;
    /* margin-top: 68px; */
    font-weight: 400;
    
    letter-spacing: 0.02em;
    text-align: left;
    
}

.galerytext{
    display: flex;
    flex-direction: column;
    gap: 2vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    padding-left: 3vw;
    padding-right: 3vw;
    
}

.wrapper__center{
    background: linear-gradient(180deg, #A7C4DC 0%, #102D4A 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 46%;
    

}
.head{
    font-size: 3vw;
    font-weight: 400;
    line-height: normal;
}

.textg, .textg2{
    font-size: 1.3vw;
    font-style: italic; 
    font-family: "Systopie";
}


.button {
    position: relative;
    justify-content: right;
    margin-top: 3vw;
    overflow: visible;
    display: flex;
    margin-right: 3vw;
    align-items: center;
    
    
}

.arrow {
    transition: transform 0.3s ease-out;
    z-index: 1;
    width: 2.5vw;
    object-fit: cover;
}

.arrow img{
    width: 100%;
    height: 100%;
}

.arrowmargin{
    margin-top: -0.1vw;
}

.arrowmargin img{
    width: 100%;
    height: 100%;
}

.null50 {
    
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    z-index: 2;
    /* margin-top: 4px;
    margin-right: 5px; */
    font-size: 1vw;
    font-style: italic;
    font-weight: 400;
    line-height: normal;
    
}



.button:hover .null50 {
    opacity: 1;
    
    
}

.button:hover .arrow {
    transform: translateX(3vw);
    
}

.bcinfoimg {
    width: 54%;
    background: url("./assets/images/bcimage.jpeg"); 
    background-size: cover; 
    transition: transform 0.3s ease-in-out; 
    position: relative;
    overflow: hidden;
    background-position: center;
}
.bcinfoimg{
    background: url("./assets/images/bcimage.jpeg");
    background-size: cover;
}

.galeryimg::after, .bcinfoimg::after,
 .imsnews::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    transition: transform 0.3s ease-in-out;
    background-position: center;
}


.imsnews::after{
    background: url("./assets/images/lowerfirstsvg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-repeat: no-repeat;
}

.sokolov::after{
    background: url("./assets/images/SOKOLOV.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-repeat: no-repeat;
}

.mvideo::after{
    background: url("./assets/images/mvideosvg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-repeat: no-repeat;
}
.bcinfoimg::after{
    background: url("./assets/images/bcimage.jpeg");
    background-size: cover;
    background-repeat: no-repeat;

}
 .galeryimg::after{
    background: url("./assets/images/galeryimg.jpeg");
    background-size: cover;
    background-repeat: no-repeat;

}
.galeryimg:hover::after, .bcinfoimg:hover::after, .imsnews:nth-child(1):hover::after, .imsnews:nth-child(2):hover::after, .imsnews:nth-child(3):hover::after { 
    transform: scale(1.05);
}

.galeryimg::before, .bcinfoimg::before, .imsnews:nth-child(1)::before, .imsnews:nth-child(2)::before, .imsnews:nth-child(3)::before{
    content: "";
    display: block;
    padding-top: 80%; 
    
}

.horizontalscroll {
    
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
}

.secondback {
    padding-top: 8vw;
    padding-bottom: 8vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1vw;
    background: url("./assets/images/photobackground.png");
    background-repeat: no-repeat;
    background-size: cover;
}

.firstline, .secondline {
    font-size: 6vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    color: transparent;
    background: url("./assets/images/wordsBack.png");
    background-position: center;
    background-clip: text;
    -webkit-background-clip: text;
    text-fill-color: transparent;
    transsition: transform 0.2s;
}


.dialog{
    position: fixed;
    z-index: 5;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.9);
    display: none;
    justify-content: center;
    align-items: center;
    overflow-y: hidden;
}

.dialog-content{
    
    
    display: flex;
    align-items: center;
    
    
}

#dialogImage {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.dialog-image-container{
    height: 40vw;
}
.dialog-content img{
    height: 100%;
}

.close-dialog{
    position: fixed;
    width: 30px;
    height: 30px;
    background: red;
    top: 30px;
    right: 30px;
}


.newsAndSales{
    flex-direction: column;
    gap: 102px;
    margin-bottom:80px;
    
}

.capnews{
    justify-content: space-between;
    width: 90%;
    margin: 0 auto;
    height: 100%;

}
.cp{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.firstnew{
    background: linear-gradient(180deg, rgba(53, 69, 81, 0.00) 0%, rgba(35, 44, 50, 0.49) 42.5%, rgba(21, 22, 24, 0.89) 94.06%),
    url("./assets/images/darvin.jpg");
    aspect-ratio: 4/3;
    width: 49%;
    background-position: center;
    justify-content: flex-end;
    text-decoration: none !important;
}
.secondnew{
    aspect-ratio: 4/3;
    width: 49%;
    background: linear-gradient(180deg, rgba(53, 69, 81, 0.00) 0%, rgba(35, 44, 50, 0.49) 42.5%, rgba(21, 22, 24, 0.89) 94.06%),
    url('./assets/images/mvideosvg.png');
    background-position: center;
    justify-content: flex-end;
}

.firstnew, .secondnew{
    background-size: cover; 
    transition: transform 0.3s ease-in-out;
    position: relative;
    overflow: hidden;
}

.firstnew::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(53, 69, 81, 0.00) 0%, rgba(35, 44, 50, 0.49) 42.5%, rgba(21, 22, 24, 0.89) 94.06%),
    url("./assets/images/darvin.jpg");
    background-size: cover;
    transition: transform 0.3s ease-in-out;
}

.secondnew::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(53, 69, 81, 0.00) 0%, rgba(35, 44, 50, 0.49) 42.5%, rgba(21, 22, 24, 0.89) 94.06%),
    url('./assets/images/mvideosvg.png');
    background-size: cover;
    transition: transform 0.3s ease-in-out;
}
.firstnew:hover::after, .secondnew:hover::after{
    transform: scale(1.1);
}

.firstnew::before, .secondnew::before{
    content: "";
    display: block;
    padding-top: 80%;
}
.capNewsText{
    padding-bottom: 2.5vw;
    padding-left: 2vw;
    flex-direction: column;
    /* gap: 21px; */
    z-index: 3;
    width: 80%;
   
   
}

.capNewsHead{
    font-size: 1.5vw;
    font-weight: 500;
    line-height: normal;
    font-family: "Systopie";
    text-decoration: none;
    color: white;
}

.capNewsBody{
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    font-family: "Systopie";
}
.name{
    color: rgba(0, 0, 0, 0.76);
    font-size: 3vw;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    /* padding-top: 30px; */
    padding-bottom: 4vw;
}

.lowernews{
    justify-content: space-between;
    width: 90%;
    margin: 0 auto;
    
}

.loweritem{
    width: 31%;
}
.galeryimg {
    width: 54%;
    background-size: cover; 
    transition: transform 0.3s ease-in-out; 
    background: url("./assets/images/galeryimg.jpeg");
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

.galeryimg::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-repeat: no-repeat;
    transition: transform 0.3s ease-in-out;
}

.galeryimg:hover::after {
    transform: scale(1.1);
}

.galeryimg::before {
    content: "";
    display: block;
    padding-top: 80%; 
}

.lowertext{
    display: flex;
    flex-direction: column;
    gap: 19px;
    margin-top: 46px;
    
}
.lowerNewsHead{
    color: rgba(21, 22, 24, 0.89);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.lowerNewsBody{
    color: rgba(21, 22, 24, 0.69);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-family: "Systopie";
}

.allnewsbtn{
    margin: 0 auto;
}


.swiper__desktop {
width: 100%;

overflow: hidden;
display: flex;
align-items: center;
position: relative; 
margin-bottom: 6vw;
margin-top: 6vw;
}

.button-prev,
.button-next {
    z-index: 3;
    position: absolute; 
    top: 50%; 
    transform: translateY(-50%);
    width: 3vw;
    object-fit: cover;
}

.button-prev img, .button-next img{
    width: 100%;
    height: 100%;
}

.swiper-img{
    width: 100%;
    height: 100%;
    
}

.button-prev {
    left: 0; 
    margin-left: 5%;
}

.button-next {
    right: 0; 
    margin-right: 5%;
}

.swiper-wrapper {
    display: flex;
    gap: 1vw;
    align-items: center;
}

.swiper-slide {
    width: 20%;
    
    display: flex;
    align-items: center;
    justify-content: center;
    object-fit: cover;
}

.swiper-slide img {
    width: 100%;
    height: 100%;
     object-fit: contain;
}




/* ----------------------------------nextbutton on form------------------------  */
.btnnext {
    border-radius: 5px;
    background: linear-gradient(180deg, #DC8F43 0%, #CB5437 100%);
    font-size: 1vw;
    font-weight: 500;
    line-height: normal;
    height: 3.2vw;
    width: 30%;
    align-items: center;
    justify-content: center;
    transition: filter 0.3s ease; 
    cursor: pointer;
    border: none;
}

.btnnext:hover {
    filter: brightness(1.1);
}

/* ---------------------------------------------------------------------------  */
.getcatalog{
    height:26vw; 
    background: linear-gradient(270deg, rgba(16, 45, 74, 0.77) 0.2%, rgba(16, 45, 74, 0.08) 99.87%), url("./assets/images/blue-wave-with-white-background.png"), linear-gradient(270deg, rgba(16, 45, 74, 0.77) 0.2%, rgba(16, 45, 74, 0.08) 99.87%);
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 7vw;
    

}

.getcatalog__wrapper{
    display: flex;
    justify-content: space-around;
    width: 95%;
    margin: 0 auto;
    align-items: center;
   
    
}

.telephoneimg{
    width: 29vw;
    margin-top: -4.58vw;
    object-fit: cover;
    

}
.telephoneimg img{
    width: 100%;
    height: 100%;
    
}

.forms{
    width: 100%;
    background: #FCFAFA;
    padding-top: 1vw;
    padding-bottom: 1vw;
    border-radius: 0.3vw;
    align-items: center;
   
}

.forms-wrapper{
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    gap: 1vw;

}
.forma-item {
    display: flex;
    flex-direction: column;
    gap: 1vw;
        
}
.selectbutton{    
    justify-content: space-between;
}
/* ------------------------select-------------------------- */
.custom-select-wrapper {
    position: relative;
    width: 60%;    
}

.custom-select-wrapper select.custom-select {
    width: calc(100% - 10px); 
    border-radius: 5px;
    background: #E8E7E7;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    outline: none;
    height: 100%;
    padding-left: 0.3vw; 
    color: #000;
    font-size: 1vw;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.custom-button {
    position: absolute;
    top: 15%;
    right: 5%;
    width: 1vw; 
    height: 2vw;
    object-fit: cover;
    background: url("./assets/images/arrows.svg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border: none;
    pointer-events: none;

}

.custom-button img{
    width: 100%;
    height: 100%;
}
/* ------------------------select-------------------------- */
/* ------------------------inputs area-------------------------- */
input:focus {
    outline: none;
    
}
.custom-input-wrapper,
.custom-phone-input-wrapper {
    position: relative;
    width: 30%; 
    height: 3vw;
}

.custom-input-wrapper{
    width: 47%;
}

.custom-input,
.custom-phone-input {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background: #E8E7E7;
    color: #000;
    font-size: 1vw;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 0 10px;
    box-sizing: border-box;
    transition: border-color 0.3s, color 0.3s;
    border: 1px solid transparent; 
}

.custom-input:focus,
.custom-input:active,
.custom-input.has-data {
    border-color: #0030DC;
}

.custom-phone-input:focus,
.custom-phone-input:active {
    border-color: #0030DC;
    color: #000;
}
/* ------------------------inputs area-------------------------- */
.blockWithForm-head{
    font-family: "Systopie";
    font-size: 2.75vw;
    font-weight: 500;
    line-height: normal;
    

}

.blockWithForm{
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2vw;
    width: 40%;
    padding-top: 1vw;
    padding-bottom: 1vw;
    
}

.questions{
    display: flex;
    gap: 16px;


}
.ask{
    font-size: 1vw;
    font-family: "Systopie";
    font-weight: 400;
    line-height: normal;
}

.questions-pagination{
    width: 90%;
    gap: 1vw;
    
}
.questions{
    color: #636363;
    font-size: 1.3vw;
    font-style: normal;
    font-weight: 100;
    line-height: normal;
    font-family: "Systopie";
    align-items: center;
}

.inputs{
    width: 60%;
    justify-content: space-between;
}
.pagination{
    padding-top: 1vw;
    gap: 0.5vw;
}
.pagination-item{
    height: 0.17vw;
    width: 2vw;
    border-radius: 0.2vw;
    background: #D9D9D9;
    opacity: 0.5;
    cursor: pointer;
}
.current{
    background:#102D4A87;
    opacity: 1;
}

.radiobtn {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.accept{
    display: flex;
    gap: 12px;
    align-items: center;
    color: #818181;
    
    font-size: 17px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    
}

.acceptinfo, .form-link{
    font-family: "Systopie";
    color: #818181; 
    font-size: 0.7vw;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}
.form-link{
    color: #102D4A;
}

#image1{
    display: flex;
}
#image2{
    display: none;
}


/* ------------------------number-------------------------- */
.custom-phone-input-wrapper {
    position: relative;
    width: 60%;
    justify-content: space-between;
}

.custom-phone-input {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    border: 1px solid #0030DC;
    background: #E8E7E7;
    font-size: 1vw;
    font-weight: 400;
    line-height: normal;
    padding: 0 10px;
    box-sizing: border-box;
    transition: border-color 0.3s, color 0.3s;
    width: 100%;
}

.custom-phone-input:focus,
.custom-phone-input:active {
    border-color: #0030DC;
    color: #000;
}

/* ------------------------number-------------------------- */






/* ----------------------------------nextbutton on form------------------------  */
.btnnext {
    border-radius: 5px;
    background: linear-gradient(180deg, #DC8F43 0%, #CB5437 100%);
    font-size: 1.1vw;
    font-weight: 500;
    line-height: normal;
    height: 3vw;
    width: 30%;
    align-items: center;
    justify-content: center;
    transition: filter 0.3s ease; 
    cursor: pointer;
}

.btnnext:hover {
    filter: brightness(1.1);
}
.close-button {
    width: 279.682px;
    height: 48px;
}
.closeimage{
    width: 1vw;
    object-fit: cover;
}
.galochka{
    width: 5vw;
    object-fit: cover;
}

.galochka img{
    width: 100%;
    height: 100%;
}

.closeimage img{
    width: 100%;
    height: 100%;
}
.catalogOverlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    opacity: 0;
    transition: opacity 0.3s ease;
    
    
}


.catalogOverlay.active {
    display: flex;
    opacity: 1;
}

.whitebackground{
    width: 20%;
    
    background-color: #FFF;
    border-radius: 0.4vw;
    margin: 0 auto;
    
}
.catalogOverlayWrapper {
    background: 
    url("./assets/images/blue-wave-with-white-background 1.png");
    background-repeat: no-repeat;
    background-size: cover;
    padding: 1.2vw;
    border-radius: 10px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    gap: 2vw;
    
}

.skip {
    display: flex;
    justify-content: space-between;
    object-fit: cover;
}

.acceptText {
    display: flex;
    flex-direction: column;
    gap: 0.3vw;
    align-items: center;
}

.confirmText{
    font-size: 1vw;
    font-weight: 600;
    line-height: normal;
    font-family: 'Helvetica Neue';
}

/* -----------------footer start----------------------- */


.ft{
    font-size: 1vw;
    font-weight: 500;
    line-height: normal;
}


.footer__logo{
    width: 10vw;
    object-fit: cover;
    display: flex;
    flex-direction: column;
    gap: 1vw;
    align-items: center;
    
}

.footer__logo img{
    width: 100%;
    height: 100%;
}

.number__policy{
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 0.1vw;
    margin-left: 8vw;
}

.linkitem {
    position: relative;
    display: inline-block;
    cursor: pointer;
    overflow: hidden;
    padding-bottom: 3px;
  }
  
  .linkitem::before,
  .linkitem::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 1.5px; 
    background-color: #FFF; 
    transition: width 0.5s ease, left 0.5s ease; 
  }
  
  .linkitem::before {
    transform: translateX(-50%);
  }
  
  .linkitem::after {
    transform: translateX(50%);
  }
  
  .linkitem:hover::before,
  .linkitem:hover::after {
    width: 100%; 
    left: 0;
  }

/* -----------------footer end----------------------- */

.aboutRent__wrapper,
.galeryinfo,
.swiper__desktop,
.bcinfo,
.name,

.getcatalog {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.3s ease, transform 1s ease;
}

.visible {
    opacity: 1;
    transform: translateY(0);
}



.droplink{
    position: relative;
    font-size: 0.6vw;
    font-weight: 500;
    line-height: normal;
    display: inline-block;
    cursor: pointer;
    padding-bottom: 4px;
}


.droplink::after{
    content: '';
    position: absolute;
    left: 3%;
    right: 3%;
    bottom: 0;
    margin: 0 auto;
    width: 94%;
    border-bottom: 2px solid transparent;
    transition: border-color 0.3s ease;
}

.droplink:hover::after{
    border-color: black; 
}
  

.dropdown {
    position: relative;
    display: inline-block;

  }
  
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    width: 14vw;
    padding-bottom: 0.5vw;
    padding-top: 0.5vw;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
    z-index: 1;
    transform-origin: center top;
    animation: slideIn 0.3s ease-in-out;
    border-radius: 1vw;
    margin-left: -1.7vw;
    /* white-space: nowrap; */
  }
  
  .dropdown-content a {
    color: black;
    padding-top: 0.7vw;
    padding-bottom: 0.7vw;
    text-decoration: none;
    display: block;
    font-size: 0.8vw;
    
  }
  
  .dropdown:hover .dropdown-content {
    display: block;
    left: -3vw;
    
    
  }
  .renta{
    border-color: black; 
  }

  
  @keyframes slideIn {
    from {
      transform: scaleY(0);
    }
    to {
      transform: scaleY(1);
    }
  }
/* -----------------------------------desktop responsive---------------------- */







@media screen and (min-width:1000px) and (max-width:1200px) {
     .telephoneimg{
        display: none;
    } 
   
} 




