Adaptive V3

site/style/background.css

@@ -13,6 +13,8 @@
 
         border-radius: 2vw;
         overflow: hidden;
+
+        box-shadow: 0 0 1em rgba(0,0,0,0.7);
     }
     
     body{
@@ -30,8 +32,10 @@
         text-align: center;
 
         background-color:  var(--vologdaBoxColor);
-        border-radius: 1vw;
+        border-radius: 2em;
         overflow: hidden;
+
+        box-shadow: 0 0 1em rgba(0,0,0,0.7);
     }
 
     .vologdaPlace{
@@ -45,8 +49,10 @@
         text-align: center;
 
         background-color:  var(--vologdaBoxColor);
-        border-radius: 1vw;
+        border-radius: 2em;
         overflow: hidden;
+
+        box-shadow: 0 0 1em rgba(0,0,0,0.7);
     }
 
     .vologdaMap{
@@ -55,17 +61,19 @@
         margin-top: var(--vologdaBoxMargin);
 
         width: var(--defaultBoxWhight);
-        height: 30vw;
+        height: 600px;
 
         text-align: center;
 
         background-color:  var(--vologdaBoxColor);
         overflow: hidden;
 
-        -moz-border-radius: 1vw 1vw 1vw 1vw; /* Firefox */
-        -webkit-border-radius: 1vw 1vw 1vw 1vw; /* Safari, Chrome */
-        -khtml-border-radius: 1vw 1vw 1vw 1vw; /* KHTML */
-        border-radius: 1vw 1vw 1vw 1vw; /* CSS3 */
+        -moz-border-radius: 2em 2em 2em 2em; /* Firefox */
+        -webkit-border-radius: 2em 2em 2em 2em; /* Safari, Chrome */
+        -khtml-border-radius: 2em 2em 2em 2em; /* KHTML */
+        border-radius: 2em 2em 2em 2em; /* CSS3 */
+
+        box-shadow: 0 0 1em rgba(0,0,0,0.7);
     }
 
     footer{
@@ -76,22 +84,19 @@
         width: var(--headFootBoxWhight);
 
         background-color: var(--headerBoxColor);
-        border-radius: 1vw;
+        border-radius: 2em;
 
         text-align: center;
         overflow: hidden;
+
+        box-shadow: 0 0 1em rgba(0,0,0,0.7);
     }
  
     :root {
-        /* --headerBoxColor:rgb(177, 250, 250);
-        --postHeaderBoxColor:rgb(175, 238, 238);
-
-        --bodyBoxColor:rgb(255, 255, 255); */
-
         --vologdaBoxMargin: 6vw;
         --boxHeight: 3.1vw;
 
-        --defaultBoxWhight: 600px;
+        --defaultBoxWhight: 750px;
         --headFootBoxWhight: 900px;
 
         --vologdaBoxColor: rgb(177, 250, 250);
@@ -119,14 +124,7 @@
 
     @media (max-width: 1100px) {
         :root {
-            --defaultBoxWhight: 80%;
-            --headFootBoxWhight: 90%;
-        }
-    }
-
-    @media (max-width: 920px) {
-        :root {
-            --defaultBoxWhight: 85%;
+            --defaultBoxWhight: 90%;
             --headFootBoxWhight: 95%;
         }
     }

site/style/buttonStyle.css

@@ -34,18 +34,34 @@
     }
 
     :root {
-        --sizeButton: 1;
+        --sizeButton: 1.5;
     }
 
     @media screen and (max-width: 1100px) {
         :root {
-            --sizeButton: 2;
+            --sizeButton: 4;
+        }
+
+        .button-grid {
+            display: grid;
+            display: grid;
+            grid-template-columns: 4fr 4fr;
+            grid-template-rows: 4fr 4fr;
+            grid-gap: 4fr;
         }
     }
 
 
     @media screen and (max-width: 920px) {
         :root {
-            --sizeButton: 2.5;
+            --sizeButton: 4;
+        }
+
+        .button-grid {
+            display: grid;
+            display: grid;
+            grid-template-columns: 4fr 4fr;
+            grid-template-rows: 4fr 4fr;
+            grid-gap: 4fr;
         }
     }