activity: Move .container CSS from bootstrap to activity.css.

* `.container` class is only used in `/activity/support` and
  `/activity/remote/support` pages. It is also used in emails but
  it has its own CSS.

* Since the CSS applied is localized and looks good, we just
  move the CSS relevant to us to `activity.css` which is used
  by both of these pages.

* Searched `"container"`, ` container `, `"container ` and
  ` container"` to look for the uses of this class.

web/styles/portico/activity.css

@@ -512,3 +512,21 @@ tr.admin td:first-child {
         margin-top: 5px;
     }
 }
+
+.container {
+    width: 940px;
+    margin-right: auto;
+    margin-left: auto;
+
+    @media (width <= 767px) {
+        width: auto;
+    }
+
+    @media (767px < width <= 979px) {
+        width: 724px;
+    }
+
+    @media (width >= 1180px) {
+        width: 1170px;
+    }
+}

web/third/bootstrap/css/bootstrap.portico.css

@@ -79,22 +79,6 @@ a:focus {
   color: #005580;
   text-decoration: underline;
 }
-.container {
-  width: 940px;
-}
-.container {
-  margin-right: auto;
-  margin-left: auto;
-}
-.container:before,
-.container:after {
-  display: table;
-  content: "";
-  line-height: 0;
-}
-.container:after {
-  clear: both;
-}
 p {
   margin: 0 0 10px;
 }
@@ -290,9 +274,6 @@ input:focus:invalid:focus {
     padding-left: 20px;
     padding-right: 20px;
   }
-  .container {
-    width: auto;
-  }
   .row {
     margin-left: 0;
   }
@@ -310,9 +291,6 @@ input:focus:invalid:focus {
   .row:after {
     clear: both;
   }
-  .container {
-    width: 724px;
-  }
   input {
     margin-left: 0;
   }
@@ -330,9 +308,6 @@ input:focus:invalid:focus {
   .row:after {
     clear: both;
   }
-  .container {
-    width: 1170px;
-  }
   input {
     margin-left: 0;
   }