.upload{margin:30px 0;position:relative}.drop{border:1px solid #eceef1;border-radius:5px;margin-top:32px;padding:18px;text-align:center}.drop a{color:#0f679a;font-size:16px;background:url(../images/photo.png) no-repeat left center;cursor:pointer;display:inline-block;padding-left:25px}.drop a.idone{background:url(../images/check.png) no-repeat left center}.drop input,.upload ul li input{display:none}.upload ul{width:100%;background:#fff 0 0;left:0;list-style:outside none none;margin-top:5px;position:absolute;top:auto}.upload ul li{background:#fff 0 0;border-bottom:1px dashed #eceef1;padding:10px 15px;position:relative;z-index:2}.upload ul li p{color:#517e99;float:left;font-size:16px;padding-left:10px;position:static;vertical-align:top;width:80%;margin:0}.upload ul li i{color:#517e99;display:block;font-style:normal}.upload ul li canvas{float:left}.upload ul li span{width:15px;height:12px;background:url(../images/icons.png) no-repeat;position:absolute;top:34px;right:15px;cursor:pointer}.upload ul li.working span{height:16px;background-position:0 -12px}.upload ul li.error p{color:red}

/* Основной контейнер переключателя */
.lang-switcher {
    position: fixed;
    top: 150px;
    right: 0;
    transform: translateY(-50%);
    background: #00aca9;
    color: white;
    padding: 10px;
    line-height: 20px;
    border-radius: 10px 0 0 10px;
    box-shadow: -2px 2px 6px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    z-index: 1000;
    font-family: Arial, sans-serif;
}

/* Закрытый режим */
.lang-switcher.collapsed {
  width: 30px;
  text-align: center;
  padding: 10px 5px;
}

/* Кнопки языков */
.lang-options {
  display: none;
  flex-direction: column;
  gap: 10px;
  padding-top: 5px;
  align-items: center;
}

.lang-option {
  background: none;
  border: none;
  text-shadow: 1px 1px 3px black;
  color: white;
  font-size: 16px;
  cursor: pointer;
  text-align: center;
  transition: 0.3s;
}

.lang-option:hover {
  text-decoration: underline;
}

/* Заголовок "Choose language" */
.toggle-btn {
    font-size: 14px;
    font-weight: 700;
    text-shadow: 1px 1px 3px black;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    text-align: center;
}

/* Крестик (кнопка закрытия) */
.close-btn {
  background: none;
  border: none;
  z-index: 2;
  margin: 0 auto;
  text-align: center;
  width: fit-content;
  top: 0;
  right: 10px;
  color: white;
  text-shadow: 1px 1px 3px black;
  height: auto;
  line-height: unset;
  font-size: 17px;
  cursor: pointer;
  align-self: flex-end;
  margin-bottom: 5px;
  transition: 0.3s;
}

.close-btn:hover {
  opacity: 0.8;
}



/*TG BUTTON*/
.telegram-button {
    position: fixed;
    right: 17px;
    bottom: 42%;
    transform: translate(-50%, -50%);
    background: #039be5; /*цвет кнопки*/
    border-radius: 50%;
    width: 55px; /*ширина кнопки*/
    height: 55px; /*высота кнопки*/
    color: #fff;
    text-align: center;
    line-height: 53px; /*центровка иконки в кнопке*/
    font-size: 35px; /*размер иконки*/
    z-index: 9999;
}
.telegram-button a {
    color: #fff;
}
.telegram-button:before,
.telegram-button:after {
    content: " ";
    display: block;
    position: absolute;
    border: 50%;
    border: 1px solid #039be5; /*цвет анимированных волн от кнопки*/
    left: -20px;
    right: -20px;
    top: -20px;
    bottom: -20px;
    border-radius: 50%;
    animation: animate 1.5s linear infinite;
    opacity: 0;
    backface-visibility: hidden; 
}
 
.telegram-button:after{
    animation-delay: .5s;
}
i.fa.fa-telegram {
    margin-top: 12px;
}
@keyframes animate
{
    0%
    {
        transform: scale(0.5);
        opacity: 0;
    }
    50%
    {
        opacity: 1;
    }
    100%
    {
        transform: scale(1.2);
        opacity: 0;
    }
}

@media (max-width : 800px) {  
.telegram-button {   
    bottom: 10px; /*отступ кнопки снизу от экрана*/
    right: 10px; /*отступ кнопки слева от экрана( left- справа)*/
  }
}