.mar{
    background-color: #63AAC2;
}
.mar a:hover{
    color: #054256;
}
h1{
    padding: 10px;
    margin-top: 10px;

}
h1 + p{
    text-align: justify;
    margin-right: 10px;
}
.galery{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 98%;
}

.item{
    flex: 1 1 30%; /* Базовая ширина каждого div составляет 33.33% от ширины родительского контейнера */
    text-align: center;
    
}

div img{
    object-fit: contain; /* Обеспечивает, чтобы весь контент изображения был виден, не обрезая лишнее */
    /* Обрезка изображения, чтобы оно заполнило доступное пространство */
    margin: 10px;
    width: 90%;
    /* max-height: 50vw; */
    height: auto;
}

@media (max-width: 768px) {
    .item {
        flex: 1 1 100%; /* На мобильных устройствах каждый div занимает всю ширину */
    }
}