Separate out some specific workshop classes.

The workshop template is mostly plain bootstrap, so getting it work
alongside the site CSS seems mostly straightforward. We only need to
add in a .workshop class to the body, and a .card class to the
.container in the workshop. Everything else is bootstrap content.

This commit also removes the banner.html include since this did not
seem to be removed in the main site, but was referenced in the CSS.
Removing it makes it clear the .banner class is only needed in the
workshop, not here.

swc-workshop-and-lesson.css

@@ -0,0 +1,32 @@
+body.workshop {
+	background-color: #BEC3C6;
+	margin: 20px 0;
+}
+
+.card {
+	background-color: white;
+}
+
+/* Top banner of every page. */
+div.banner {
+	background-color: #FFFFFF;
+	width: 100%;
+	height: 90px;
+	margin: 0px;
+	padding: 0;
+	border-bottom: 1px solid #A6A6A6;
+}
+
+/* Padding around image in top banner. */
+div.banner a img {
+	padding: 20px 25px;
+}
+
+/* Footer of every page. */
+div.footer {
+	clear: both;
+	background: url("/img/main_shadow.png") repeat-x scroll center top #FFFFFF;
+	padding: 4px 10px 7px 10px;
+	border-top: 1px solid #A6A6A6;
+	text-align: right;
+}

swc.css

@@ -85,21 +85,6 @@ body.stylesheet {
     margin: 20 auto;
 }
 
-/* Top banner of every page. */
-div.banner {
-    background-color: #FFFFFF;
-    width: 100%;
-    height: 90px;
-    margin: 0px;
-    padding: 0;
-    border-bottom: 1px solid #A6A6A6;
-}
-
-/* Padding around image in top banner. */
-div.banner a img {
-    padding: 20px 25px;
-}
-
 /* Explanatory call-out boxes. */
 div.box {
     width: 54em;
@@ -130,15 +115,6 @@ div.files {
     padding: 10px;
 }
 
-/* Footer of every page. */
-div.footer {
-    clear: both;
-    background: url("/img/main_shadow.png") repeat-x scroll center top #FFFFFF;
-    padding: 4px 10px 7px 10px;
-    border-top: 1px solid #A6A6A6;
-    text-align: right;
-}
-
 .swc-blue-bg {
    /*background-color: #20267D;*/
    /* svg colour is slightly different? */