@font-face {
    font-family: Ponomar-Regular;
    src:url('/fonts/Ponomar-Regular.ttf');
}

.nav-link:hover {
        border-bottom: 5px solid black;
        opacity: 50%;
}

.footer {
        background-color: #000;
        padding: 70px 0;
}
.footer p{
        color: #fff;
}
p {
    text-indent: 2rem;
    margin: 0.3rem;
    padding: 0;
    /* Автоматические переносы по правилам языка */
    hyphens: auto; 
     /* Перенос длинных слов */
    /*overflow-wrap: break-word;*/
     /* Пример ширины для демонстрации переносов */
    /*width: 200px;*/

}
.social_icon  {
        margin: 0 10px;
        width:50px; 
        height: auto;
        border-radius: 50%;
}
.header_logo {
        width: 70px; 
        height: auto;        
}
.footer_logo {
        margin: 0 10px;
        width: 200px; 
        height: auto;
}

.inn{
    padding-right: 2rem;
    padding-bottom: 1rem;
}

.social_icon:hover {
        background-color: green;
}
.master_home {
     display: flex;          
}
.master_about {
     display: flex; 
     flex-direction: row-reverse;
}
.content {
        display: flex;
        justify-content: center;
        align-items: center;/*положение текста*/
        flex-direction: column;
 
        animation: slideLeft 1s forwards;
/*        ШРИФТ***********************************************************************************************/
/*        font-family: Ponomar-Regular;*/
/*        font-size: 1.5rem;*/
/*        font-weight: 100;*/
        background-color: #fff;
}

/*.content p{
     text-align: left; 
}*/

.div_001{
/*    border-bottom: 1px solid black;*/
/*    border-top: 1px solid black;*/
/*    width: 45%;*/
    padding: 2rem;
    text-align: center;
    font-weight: 700;
}

.stripe{
    border: none; 
    height: 1px;           
    background-color: #000; 
    width: 9rem;  
}

.my_photo_home {
        border-radius: 33px;
        opacity: 0;   /* Начальная прозрачность — 0 (невидимо) */
        transform: translateX(100%); /* Начальное смещение изображения (справа) */
        animation: slideRight 1s forwards; /* Запуск анимации при загрузке */
}
.my_photo_about{
        border-radius: 33px;
        opacity: 0;   /* Начальная прозрачность — 0 (невидимо) */
        transform: translateX(100%); /* Начальное смещение изображения (справа) */
        animation: slideLeft 1s forwards; /* Запуск анимации при загрузке */
}

.card {
    border-radius: 1.7rem;
    border: 0.12em solid rgba(83, 37, 40, 0.5);
    box-shadow: 5px 0px 30px rgba(0, 0, 0, 0.5);
    display: flex; /* активация flexbox для карточек */
    flex-direction: column; /* вертикальное выравнивание содержимого */
    justify-content: space-between; /* выравнивание содержимого: по краям */
    height: 100%; 

}

.card-body {
    display: flex; /* Включаем flexbox для card-body */
    flex-direction: column; 
    justify-content: space-between; /* Распределяем пространство между элементами */
    height: 100%; /* Устанавливаем высоту в 100% */
}


.card img{
    border-radius: 1.7rem 1.7rem 0 0;
}

.offer {
    font-size: .8rem;
    font-weight: bold; /* Сделаем оферы жирными для лучшей читаемости */
}
.price {
    font-size: .8rem;
    font-weight: bold;
    text-align: right; /* Выравнивание цен вправо */
}

@keyframes slideRight{
    0%{
        opacity: 0; 
        transform: translateX(100%); /* Начальная позиция справа */
        }
    100%{
        opacity: 1; 
        transform: translateX(0); /* Конечная позиция */
        }
}

@keyframes slideLeft{
    0%{
        opacity: 0; 
        transform: translateX(-100%); /* Начальная позиция справа */
        }
    100%{
        opacity: 1; 
        transform: translateX(0); /* Конечная позиция */
        }
}
.btn_msg{
    width:60%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.8rem;
    background-color: #efd9d5;
    border: 0.12em solid rgba(83, 37, 40, 0.5);
    transition: .3s;
/*    margin-top: auto; /* Позволяет кнопке "выполнить" вниз */*/


}
.btn_msg img, .image-container {
    width:35px;
    border-radius: 50%;
    height: auto;
}

/*Кнопка*/
.btn_msg:hover {
    background-color: #ffd9d5;
    outline: 3px solid #ffd9d5;
    outline-offset: 3px;
    box-shadow: 10px 0px 50px rgba(0, 0, 0, 0.5);
    color: #295c63;
}
.btn_msg:hover .image-container{
    background-color: #0088cc;
}


.btn_msg:active {
    box-shadow: 5px 0px 30px rgba(0, 0, 0, 0.7);
    color: gray;
    background-color: #efd9d5;
    outline: 0px solid #ffd9d5;
    outline-offset: 0px;
}

.accordion{
/*    background-color: #efd9d5; */
/*    border-radius: 1.7rem 1.7rem 1.7rem 1.7rem;*/
/*    border: 1rem solid rgba(83, 37, 40, 0.5);*/
    box-shadow: 5px 0px 30px rgba(0, 0, 0, 0.5);
}
.accordion-button {
    background-color: #ffffff; /* Цвет фона кнопки при загрузке (по умолчанию) */
    color: #000000; /* Цвет текста кнопки при загрузке (по умолчанию) */
    border: 0px solid #ced4da; /* Цвет границы кнопки при загрузке (по умолчанию) */
    transition: background-color 0.3s ease, color 0.3s ease; /* Плавный переход цветов */
}

.accordion-button:focus {
    box-shadow: none; /* Убираем обводку при фокусе */
}


.accordion-button:not(.collapsed) {
    color: #000;
    background-color: #fff;
}

.accordion-button.collapsed {
    background-color: #efd9d5; /* Цвет фона кнопки при закрытом состоянии */
    color: #000; /* Цвет текста кнопки при закрытом состоянии */
    opacity: 30%;
}


.accordion-body {
    background-color: #f8f9fa; /* Цвет фона содержимого аккордеона (при открытии) */
    color: #495057; /* Цвет текста содержимого аккордеона */
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000000'%3e%3cpath stroke='black' stroke-width='2' fill='none' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transition: transform 1s ease;
    transform: rotate(270deg);
 }


.accordion-button:focus::after {
    transform: rotate(180deg); 
}

.accordion-button.collapsed::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000000'%3e%3cpath stroke='black' stroke-width='2' fill='none' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transition: transform 1s ease;
    transform: rotate(270deg); 
}


.accordion-item{
    
}

.custom-spinner {
    width: .7rem;      /* Установите желаемую ширину */
    height: .7rem;     /* Установите желаемую высоту */
    color: green;
}
.small-text {
    color: #000;
    font-weight: 700;
    font-size: 0.8rem; /* Установите желаемый размер шрифта */
    padding-right: 1rem;
    padding-left: 1.5rem;
}

.responseMessage{
    text-align: center;
    font-size: 15px;
    font-weight: 500;
    color: green;
}
.popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* полупрозрачный фон */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000; /* выше остальных элементов */
}

.popup-content {
    background-color: gray;
    padding: 20px;
    border-radius: 30px;
    text-align: center;
    position: relative;
    border: 7px solid #000;
    padding-top: 5vh;
    max-height: 65vh;
}

.close {
    position: absolute;
    top: -15px;
    right: 10px;
    font-size: 50px;
    cursor: pointer;
    color: #aaa;
/*    border: 1px solid #000;*/
    font-weight: 700;
}

.close:hover {
    color: red; /* цвет при наведении */
}
.img_doc {
    margin: 0.2rem;
    padding:0;
}
.img_doc img {
    border-radius: 1.5rem;
    border: 10px solid #000;
    padding:0;
    transition: transform 1s ease;
}

.img_doc img:active {
    transform: scale(2); /* Увеличиваем картинку при наведении */
}

.modal-body img {
    max-width: 70%; /* Ограничьте максимальную ширину */
    height: auto; /* Автоматическая высота */
}

.square-image {
    width: 250px; /* Фиксированная ширина */
    height: 250px; /* Фиксированная высота */
    object-fit: cover; /* Обрезает изображение, сохраняя пропорции */
    border: .1rem solid #ffd9d5;
    border-radius: 2.5rem;
    box-shadow: 17px 17px 30px rgba(0, 0, 0, 0.5);
}
.text-container {
    max-width: 600px; /* Установите желаемую максимальную ширину для текста */
    text-align: center; /* Центрируем текст */
}

.gradient-background-001 {
    background: linear-gradient(to right, #A5D6A7, #81C784, #388E3C);
    padding: 16px; /* Добавляем отступы для видимости градиента */
    border-radius: 8px; /* Закругляем углы, если это необходимо */
    color: white; /* Устанавливаем цвет текста на белый для контраста */
}
.gradient-background-002 {
    background: linear-gradient(to right, #A7D3E0, #4FC3F7, #0088CC);
}
.gradient-background-003 {
    background: linear-gradient(to right, #F4C7C3, #FF7F7D, #E60023);
}
.gradient-background-004 {
    background: linear-gradient(to right, #F58529, #FFB808, #D5006D, #A53E91, #4C68B8);
}
.gradient-background-005 {
   background: linear-gradient(to right, #3E607A, #0063CC, #004B99);
}

.gradient-background-006 {
    background: linear-gradient(to right, #00B7E3, #0072B1, #003D66);
}

.gradient-background-006 {
    background: linear-gradient(to right, #1C3F94, #0074B7, #003366);
}






.text_001 p, span{
    padding: 0px;
    margin: 0px;  
}

.text_001 p{
    font-size: 1.7rem;
    font-weight: 500;
}

.text_001 span{
    font-size: 1.3rem;
    font-weight: 500;
}

@media (max-width: 768px) { /* Измените значение на нужное вам */
    .text_001 span{
        font-size: .8rem; /* Размер текста для маленьких экранов */

    }
}

@media (max-width: 768px) { /* Измените значение на нужное вам */
    .text_001 p{
        font-size: .8rem; /* Размер текста для маленьких экранов */
    }
}

.visit-icon{
    width: 64px;
    height: 64px;
    margin-right: .5rem;
}



@media (max-width: 576px) { /* Измените значение на нужное вам */
    .visit-icon {
        width: 48px; 
        height: 48px;
    }
}

.visit-block {
    text-decoration: none; /* Убрать подчеркивание ссылки */
    padding-top: 1.5rem; /* Добавить немного отступов */
    padding-bottom: 1.5rem; /* Добавить немного отступов */
    padding-right: 20%;
    padding-left:  20%; /* Скруглить углы блока */
    transition: transform 1s ease, box-shadow 1s ease; /* Анимация для трансформации и теней */
}

.visit-block:hover {
    transform: translateY(-15px); /* Поднять блок при наведении */
    box-shadow: 10px 40px 30px rgba(0, 0, 0, 0.2); /* Добавить тень при наведении */
}

.visit-block p,
.visit-block span {
    color: #fff /* Установить цвет текста, чтобы он не менялся */
}



.blog-card {
    border-radius: 1.7rem;
    border: 0.12em solid rgba(83, 37, 40, 0.5);
    box-shadow: 5px 0px 30px rgba(0, 0, 0, 0.5);
    display: flex; /* активация flexbox для карточек */
    flex-direction: column; /* вертикальное выравнивание содержимого */
    justify-content: space-between; /* выравнивание содержимого: по краям */
    height: 100%; 
}

.blog-card-body {
    display: flex; /* Включаем flexbox для card-body */
    flex-direction: column; 
    justify-content: space-between; 
    height: 100%; /* Устанавливаем высоту в 100% */
    text-align: center;
/*    align-items: center; */
}

.blog-card img{
    border-radius: 1.7rem 1.7rem 0 0;
}