+7 982 100 5 999

О компании (на главной)

HTML

<div class="about" id="about">
    <div class="container">
        <div class="miniature">
            <?php 
            $image = get_field('фото_блока_о_нас');
            if( !empty($image) ): ?>
                <img src="<?php echo $image['sizes']['medium_large']; ?>" alt="<?php echo $image['alt']; ?>" />
            <?php endif; ?>
        </div>
        <div class="text">
            <div class="content-title"><?php the_field('заголовок_блока_о_нас'); ?></div>
            <div class="entrytext"><?php the_field('текст_блока_о_нас'); ?></div>
        </div>
    </div>
</div>

LESS

.about{
    padding-top: 150px;
    padding-bottom: 150px;
    
    @media(max-width: 724px){
        text-align: center;
        padding-bottom: 90px;
    }
    .container{
        position: relative;
        padding-top: 60px;
        padding-bottom: 30px;
        
        @media(max-width: 724px){
            padding: 0 30px;
        }
    }
        
    .miniature{
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: calc(~'50% - 100px');
        overflow: hidden;
        
        @media(max-width: 724px){
            position: static;
            display: block;
            width: auto;
            height: 250px;
            margin-bottom: 40px;
        }
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
    
    .text{
        padding-left: 50%;
        
        @media(max-width: 724px){
            padding: 0;
        }
    }
}