update css

src/components/CatalogPage.vue

@@ -27,8 +27,8 @@ getScenarios()
 </script>
 
 <template>
-    <div class="center-block-custom-big content-block">
-        <div class="scenarios-container">
+    <div class="center-block-custom">
+        <div class="width1200 display-table">
             <div class="scenario-block" v-for="scenario in scenarios" @click="toScenarioInfo(scenario.id!)"
                 v-bind:key="scenario.id">
                 <div class="scenario-image-block scenario-image" :style="{ backgroundImage: `url(${scenario.image})` }">
@@ -40,7 +40,8 @@ getScenarios()
                     <p class="scenario-description">{{ scenario.description }}</p>
 
                     <p class="scenario-label">
-                        <n-tag :bordered="false" type="success" class="status-block">Автор: {{ scenario.author?.username
+                        <n-tag :bordered="false" type="success" class="status-block">Автор: {{
+                            scenario.author?.username
                         }}</n-tag>
                     </p>
                 </div>
@@ -52,17 +53,6 @@ getScenarios()
 </template>
 
 <style scoped>
-.scenarios-container {
-    display: flex;
-    flex-flow: row wrap;
-    justify-content: center;
-    overflow-y: auto;
-    padding: 0;
-    height: calc(100vh - 150px);
-
-    /* border: 1px solid red; */
-}
-
 .scenario-block {
     position: relative;
     margin: 10px;
@@ -113,10 +103,6 @@ getScenarios()
 }
 
 @media (width >=1024px) {
-    .scenarios-container {
-        height: calc(100vh - 70px);
-    }
-
     .scenario-block {
         width: 250px;
         height: 400px;