made about responsive

Author: OrionStar25

main/index.html

@@ -5,7 +5,7 @@
     <meta http-equiv="x-ua-compatible" content="ie=edge">
     <title>Hack In The North 3.0 - India's Biggest Student Hackathon</title>
     <meta name="description" content="">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
     <link rel="manifest" href="site.webmanifest">
     <link rel="apple-touch-icon" href="icon.png">

main/static/css/cards.css

@@ -15,7 +15,6 @@
 }
 
 .card-panel {
-  /*margin-top: 0;*/
   -webkit-transition: -webkit-box-shadow .25s;
   transition: -webkit-box-shadow .25s;
   transition: box-shadow .25s;
@@ -24,7 +23,8 @@
   margin: 15vh auto 2rem auto;
   border-radius: 5px;
   background-color: #fff;
-  width: 50%;
+  width: 60%;
+  height: 50%;
   position: relative;
 }
 
@@ -33,9 +33,22 @@
   box-shadow: 0 26px 34px 4px rgba(0, 0, 0, 0.44), 0 16px 40px 10px rgba(0, 0, 0, 0.42), 0 12px 14px -10px rgba(0, 0, 0, 0.4);
 }
 
-@media (max-width: 600px){
+@media (max-width: 500px){
   .card-panel{
     width: 100%;
+    height: 70vh;
+  }
+  .card-panel h4{
+    font-size: 4vw;
+  }
+}
+@media (max-width: 1250px){
+  .card-panel{
+    width: 100%;
+    height: 70vh;
+  }
+  .card-panel h4{
+    font-size: 2vw;
   }
 }