From 5e528be417d1eb69f5321a0ff7cc75c30430874f Mon Sep 17 00:00:00 2001
From: gman <gman>
Date: Wed, 25 Jun 2025 14:32:35 +0300
Subject: [PATCH] two columns layout

---
 projects.html |  6 ++----
 style.css     | 15 +++++++++++++--
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/projects.html b/projects.html
index e33455b..80d5bd9 100644
--- a/projects.html
+++ b/projects.html
@@ -28,7 +28,7 @@
         </div>
     </div>
     <div class="fullpage">
-        <div class="section">
+        <div class="section projects">
             <a class="project-container" href="postnet.html">
                 <img src="./images/postnet/postnet-cover.png" alt="" srcset="">
                 <div class="project-title">
@@ -37,8 +37,6 @@
                 <div class="project-text">геоинформационная AutoML система для контроля и развития сети
                     Московский постамат</div>
             </a>
-        </div>
-        <div class="section">
             <a class="project-container" href="emergency.html">
                 <img src="./images/emergency/cover.png" alt="" srcset="">
                 <div class="project-title">
@@ -49,7 +47,7 @@
                     ситуаций на объектах теплоснабжения</div>
             </a>
         </div>
-        <div class="section">
+        <div class="section projects">
             <a class="project-container" href="city-modelling.html">
                 <img src="./images/city/city-cover.png" alt="" srcset="">
                 <div class="project-title">
diff --git a/style.css b/style.css
index 8f202f7..cb710b2 100644
--- a/style.css
+++ b/style.css
@@ -399,22 +399,33 @@ html {
   padding-bottom: 60px;
 }
 
+.section.projects>div {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
+  margin-top: 20px;
+}
+
 
 .project-container {
   display: block;
   position: relative;
-  width: 100%;
+  width: 40%;
   height: auto;
   cursor: pointer;
   overflow: hidden;
   text-decoration: none;
+
+  @media (max-width: 850px) {
+    width: 100%;
+  }
 }
 
 .project-container img {
   object-fit: cover;
   max-width: 1200px;
   min-height: 300px;
-  max-height: 60vh;
+  max-height: 50vh;
 }
 
 /* .project-container:hover img {