diff --git a/src/styles/App.css b/src/styles/App.css
index dfbcf07..6a3f5d5 100644
--- a/src/styles/App.css
+++ b/src/styles/App.css
@@ -307,6 +307,11 @@ h3 a:hover {
   padding-left: 1.5vw;
   font-family: "Montserrat Bold";
 }
+@media (max-width: 768px) {
+  .card-title{
+    font-size: 2.5vh;
+  }
+}
 
 .card-author {
   font-size: 0.9vw;
@@ -315,6 +320,11 @@ h3 a:hover {
   padding-left: 1.5vw;
   font-family: "Montserrat Bold";
 }
+@media (max-width: 768px) {
+  .card-author{
+    font-size: 1.7vh;
+  }
+}
 /* clamp styles */
 .clamp-lines {
   border-radius: 0.25em;
@@ -325,6 +335,11 @@ h3 a:hover {
   padding-top: 1vh;
   font-size: 0.8vw;
 }
+@media (max-width: 768px) {
+  .clamp-lines{
+    width: 1.1vw;
+  }
+}
 
 .clamp-lines > span {
   display: block;
@@ -349,6 +364,11 @@ h3 a:hover {
   height: 22vh;
   /* filter: blur(3px); */
 }
+@media (max-width: 768px) {
+  .cardimage img{
+    width: 35vh;
+  }
+}
 .cardimage:hover {
   filter: none;
 }
@@ -358,12 +378,18 @@ h3 a:hover {
   height: 22vh;
   overflow: hidden;
 }
+
 .bigcard {
   width: 20vw;
   margin-bottom: 25px;
   margin-right: 8px;
   margin-left: 8px;
 }
+@media (max-width: 768px) {
+  .bigcard{
+    width: 35vh;
+  }
+}
 .row {
   width: 100%;
   display: flex;
@@ -603,6 +629,11 @@ h3 a:hover {
   text-align: center;
   height: 6vh;
 }
+@media (max-width: 768px) {
+  .img-description-text{
+    width: 1vh;
+  }
+}
 /* ARCHIVE PAGE */
 
 #intro2019 h1 {
@@ -902,6 +933,12 @@ h1.tenpx {
   width: 10vw;
   font-size: 1vw;
 }
+@media (max-width: 768px) {
+  .box{
+    width: 17.5vh;
+    font-size: 1.8vh;
+  }
+}
 .links a:first-child {
   border: #ff2457;
 
@@ -926,6 +963,11 @@ h1.tenpx {
   white-space: nowrap;
   width: 20vw;
 }
+@media (max-width: 768px) {
+  .tags{
+    width: 35vh;
+  }
+}
 .tags ul {
   list-style: none;
   display: inline-block;