fix rwd style

app/views/announcements/show.html.erb

@@ -91,9 +91,10 @@
     font-family: serif;
   }
   .announcement-comment {
+    margin-top: 1em;
     background: <%= bg_color %>;
     color: <%= color2 %>;
-    font-size: 1.3em;
+    font-size: 1.15em;
     padding-left: 3%;
     border-radius: 0.7em;
     display: inline-block;
@@ -103,12 +104,14 @@
   }
   .annc-comment-div{
     display: flex;
-    align-items: flex-start;
+    align-items: center;
+    flex-wrap: wrap;
   }
   .btn-comment{
+    margin-top: 1em;
     margin-left: 3%;
     color: <%= color2 %>;
-    font-size: 1.2em;
+    font-size: 1em;
     background: <%= bg_color %>;
     margin-left: 3%;
   }
@@ -126,6 +129,14 @@
   .annc-comments{
     margin: 1.5em 0;
   }
+  @media (max-width: 767px) {
+    .annc-comment-div{
+      justify-content: center;
+    }
+    .announcement-comment {
+      width: 100%;
+    }
+  }
 </style>
 <script type="text/javascript">
   $(function(){