JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
             <div class="header">
                 <div class="menu">
                     <a href="#">Информация</a>
                     <a href="#">Фото и видео</a>
                     <a id="logo" href="#">Логотип</a>
                     <a href="#">Карта Штата</a>
                     <a href="#">Гостиницы</a>
                 </div>
             </div> 
<div class="into">
        
</div>
                <div class="content-info">
                    <div class="feauters">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem accusantium odit reprehenderit in non asperiores, cumque hic voluptas officiis, atque quaerat ducimus esse distinctio, ipsa amet? Ad excepturi doloremque et.
                    </div>
                    <div class="firstTown">
                        <div class="firstTown-blue">
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt pariatur totam 
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Pariatur, excepturi ipsam ipsum suscipit perferendis quo odio, dolor, placeat reprehenderit optio veniam neque aspernatur, vitae at itaque qui hic. Blanditiis, sint.
                            
                        </div>
                        <div class="firstTown-picture">
                            
                        </div>
                        
                    </div>
                    
                    </div>
                    <div class="content-bloks-1">
                     <div class="Home_food_Suvenirs">
                            <div class="home">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laudantium ab molestias dolore. Asperiores alias, omnis labore numquam accusantium enim. Laboriosam a, perspiciatis nostrum id labore autem non? Nisi, nulla, nihil?</div>
                            <div class="food">Lorem ipsum dolor sit amet, consectetur adipisicing...

CSS

.container {
    
    margin-right: 3.13%;
    margin-left: 3.13%;
}
.menu {
    display: flex;
    justify-content: space-around;
    height: 57px;
    border: 1px solid green;
}
.menu a {
    text-decoration: none;
    color: black;
    margin-top: 20px;
    text-transform: uppercase;
    font-weight: bold;
}
.into {
    display: flex;
    height: 510px;
    border: 1px solid red;
}
.feauters {
    display: flex;
    height: 217px;
    border: 1px solid orange;
}
.firstTown {
    display: flex;
    min-height: 256px;
    max-height: none;
    border: 1px solid black;
}
.firstTown-blue {
    min-height: 256px;
    max-height: none;
    width: 32.24%;
    background-color: #81b3d2;
    
}
.firstTown-picture {
    height: 57px;
    width: 67.70%;
    background-color: pink;
    
}
.Home_food_Suvenirs  {
    height: 325px;
    display: flex;
    justify-content: space-around;
}
.bridge {
    
    width: 67.70%;
    background-color: red;
}
.content-bloks-2 {
    display: flex;
}
.feauteres-2 {
    height: 325px;
    display: flex;
    justify-content: space-around;
}