
  .spans span {
    padding-left: 5px
  }

  .spans span span{
    top: 0.5em;
  }


.idiss-h3 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700; /* Bold */
    font-size: 28px; /* Размер шрифта */
    color:#000000;
}

.formulator-main {
    padding: 2em;
    gap: 1em;
    display: flex;
    flex-direction: column;
    min-height: 80vh;
}
.formulator-block {
    margin-top: 2em;
    font-family: 'Montserrat', sans-serif;
    color: #AEADB1;
    font-size: 24px; /* Размер шрифта */

}


.nav-pills .nav-link {
    background-color: #F1AFB4; /* Красный фон */
    color: #FFFFFF; /* Белый цвет текста */
    border-radius: 25px; /* Закругленные края */
    margin: 5px; /* Отступы между кнопками */
    padding: 10px 20px; /* Внутренние отступы */
    border: none; /* Убираем границу */
    transition: background-color 0.3s; /* Плавный переход цвета */
}

.nav-pills .nav-link:hover {
    background-color: #E02A36; /* Цвет кнопки при наведении */
}

.nav-pills .nav-link.active {
    background-color: #E02A36; /* Цвет активной кнопки */
}



.mb-3 {
    position: relative; /* Устанавливаем относительное позиционирование для контейнера */
}

.mb-3 label {
    position: absolute; /* Устанавливаем абсолютное позиционирование для лейбла */
    top: -10px; /* Поднимаем лейбл над полем ввода */
    left: 10px; /* Устанавливаем отступ слева */
    font-size: 0.9rem; /* Размер шрифта для лейбла */
    color: #AEADB1; /* Цвет текста для лейбла */
    z-index: 2;
    padding: 0 5px; /* Отступы вокруг текста лейбла */
    background: white;
}
.mb-3 select {
    z-index: 1;
}

.idiss-button {
    color: #ffffff; /* Цвет текста кнопки */
    background-color: #E02A36; /* Цвет фона кнопки (можно изменить, если нужно) */
    border: none; /* Убираем границу, если она есть */
    margin-left: 1em;
}
.idiss-button:hover {
    background-color: #E02A36; /* Цвет кнопки при наведении */
}

.mb-3 input {
    color: #AEADB1; /* Цвет текста для лейбла */
}

.flex-container {
    display: flex; /* Используем flexbox для контейнера */
    flex-wrap: wrap; /* Позволяем элементам переноситься на новую строку */
}

@media (max-width: 768px) {
    .flex-container {
        flex-direction: column; /* На малых экранах элементы располагаются в колонку */
    }

    .input-group {
        width: 100%; /* Устанавливаем ширину для поля ввода */
    }

    .idiss-button {
        margin-top: 10px; /* Добавляем отступ сверху для кнопки */
    }
    .input-group .form-control {
        width: 100%;

    }
}

.formulator-title-block {
    background:  #F5F5F5 !important;
    box-shadow: none;
}

.formulator-form {
    height: auto;
}