Improve publication page

src/style/main.scss

@@ -185,6 +185,30 @@
     
       }
   }
+
+
+.width-md-100{width: 100%;}
+.width-md-90{width: 90%;}
+.width-md-80{width: 80%;}
+.width-md-70{width: 70%;}
+.width-md-60{width: 60%;}
+.width-md-50{width: 50%;}
+.width-md-40{width: 40%;}
+.width-md-30{width: 30%;}
+.width-md-20{width: 20%;}
+.width-md-10{width: 10%;}
+
+.max-width-md-100{max-width: 100%;}
+.max-width-md-90{max-width: 90%;}
+.max-width-md-80{max-width: 80%;}
+.max-width-md-70{max-width: 70%;}
+.max-width-md-60{max-width: 60%;}
+.max-width-md-50{max-width: 50%;}
+.max-width-md-40{max-width: 40%;}
+.max-width-md-30{max-width: 30%;}
+.max-width-md-20{max-width: 20%;}
+.max-width-md-10{max-width: 10%;}
+
 }
 
 @media only screen and (min-width: 1366px) {
@@ -332,11 +356,45 @@
 .background-black {background: black;}
 
 .text-center {text-align: center;}
+.tex-left{ text-align: left;}
+.text-right{text-align: right;}
 
 .width-100{width: 100%;}
-.height-100{height: 100%;}
-.height-fit-content{height: fit-content;}
+.width-90{width: 90%;}
+.width-80{width: 80%;}
+.width-70{width: 70%;}
+.width-60{width: 60%;}
 .width-50{width: 50%;}
+.width-40{width: 40%;}
+.width-30{width: 30%;}
+.width-20{width: 20%;}
+.width-10{width: 10%;}
+
+.max-width-100{max-width: 100%;}
+.max-width-90{max-width: 90%;}
+.max-width-80{max-width: 80%;}
+.max-width-70{max-width: 70%;}
+.max-width-60{max-width: 60%;}
+.max-width-50{max-width: 50%;}
+.max-width-40{max-width: 40%;}
+.max-width-30{max-width: 30%;}
+.max-width-20{max-width: 20%;}
+.max-width-10{max-width: 10%;}
+
+
+.height-100{height: 100%;}
+.height-90{height: 90%;}
+.height-80{height: 80%;}
+.height-70{width: 70%;}
+.height-60{height: 60%;}
+.height-50{height: 50%;}
+.height-40{height: 40%;}
+.height-30{height: 30%;}
+.height-20{height: 20%;}
+.height-10{height: 10%;}
+
+.height-fit-content{height: fit-content;}
+
 
 .border-t-radius{
     border-top-left-radius: 25px;