eng0.4.0

css/ch.css

@@ -19,15 +19,15 @@
 
 @media only screen and (min-width : 801px) {
     .nav-button {
-        width: 35%;
+        width: 50%;
         height: 15%;
     }
     .nav-button-home {
-        width: 20%;
+        width: 100%;
         height: 15%;
     }
     .nav-button-fullscreen {
-        width: 10%;
+        width: 100%;
         height: 15%;
     }
     .card-button-ch {

css/index.css

@@ -33,7 +33,7 @@
 
 @media only screen and (min-width : 801px) {
     .last-ch {
-        width: 50%;
+        width: 100%;
         height: 15%;
         padding-left: 0px;
         padding-right: 0px;
@@ -41,7 +41,7 @@
         padding-bottom: 15px;
     }
     .promo-link {
-        width: 50%;
+        width: 100%;
         height: 15%;
         padding-left: 0px;
         padding-right: 0px;

css/manga.css

@@ -1,9 +1,7 @@
 .progress-page {
     width: 100%;
 }
-.cover {
-    width: 25%;
-}
+
 .invis {
     display: none;
 }
@@ -21,4 +19,16 @@
     padding-bottom: 2px;
     padding-right: 2px;
     font-family: "Comic Sans MS";
+}
+
+@media only screen and (min-width : 801px) { 
+    .cover {
+        width: 90%;
+    }
+}
+
+@media only screen and (max-width : 800px) {
+    .cover {
+        width: 25%;
+    }
 }

css/style.css

@@ -131,11 +131,14 @@ td, th {
 .al-left {
     text-align: left;
 }
+
+
 @media only screen and (min-width : 801px) {
-    #maindiv {
-        width: 60%;
-        margin-left: 20%;
-        margin-right: 20%;
+    .pc-only {
+        display: block;
+    }
+    .mobile-only {
+        display: none;
     }
     .sitebuttons {
         width: 100%;
@@ -147,14 +150,43 @@ td, th {
     table {
         width: 150px;
     }
-}
-    
-@media only screen and (max-width : 800px) {
-    #maindiv {
-        width: 100%;
-        margin-left: 0%;
-        margin-right: 0%;
+    .content {
+        display: flex;
+        flex-direction: row;
+        flex-wrap: wrap;
+        max-height: 100%;
+        padding: 0;
     }
+    .onecol {
+        width: 20%;
+        height: 100%;
+        background-clip: content-box;
+        list-style: none;
+        padding-right: 1%;
+    }
+    .twocol {
+        width: 79%;
+        height: 100%;
+        background-clip: content-box;
+        list-style: none;
+    }
+}
+
+@media only screen and (min-width : 801px) and (max-width : 1090px) {
+    .titlediv {
+        font-size: 60%;
+    }
+}
+
+@media only screen and (min-width : 1091px) {
+    .titlediv {
+        font-size: 80%;
+    }
+}
+
+
+
+@media only screen and (max-width : 800px) {
     .sitebuttons {
         width: 100%;
     }
@@ -165,4 +197,10 @@ td, th {
     table {
         width: 130px;
     }
+    .pc-only {
+        display: none;
+    }
+    .mobile-only {
+        display: block;
+    }
 }