--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/client/src/scss/components/_SessionList.scss	Tue Dec 04 18:17:56 2018 +0100
@@ -0,0 +1,134 @@
+
+.session-count {
+    font-size: 2rem;
+    z-index: -1;
+}
+
+.sessions{
+    cursor: pointer;
+}
+
+#delete {
+    // opacity: 0;
+    // display: none;
+    -webkit-transition: .5s all;
+    -webkit-transition-delay: 5s;
+    -moz-transition: .5s all;
+    -moz-transition-delay: 5s;
+    -ms-transition: .5s all;
+    -ms-transition-delay: 5s;
+    -o-transition: .5s all;
+    -o-transition-delay: 5s;
+    transition: .5s all;
+    transition-delay: 5s;
+
+    &:hover {
+        // opacity: 1;
+        display: inline-block;
+        -webkit-transition-delay: 0s;
+        -moz-transition-delay: 0s;
+        -ms-transition-delay: 0s;
+        -o-transition-delay: 0s;
+        transition-delay: 0s;
+    }
+}
+
+.sessions:hover ~ #delete {
+    // opacity: 1;
+    display: inline-block;
+    -webkit-transition-delay: 0s;
+    -moz-transition-delay: 0s;
+    -ms-transition-delay: 0s;
+    -o-transition-delay: 0s;
+    transition-delay: 0s;
+}
+
+.sessions:hover {
+    opacity: .7;
+}
+
+
+span.session {
+
+    &-title {
+    font-size: 1.3rem;
+    white-space: pre-wrap;
+    overflow-wrap: break-word;
+    }
+
+    &-date {
+        font-size: .9rem;
+    }
+
+    &-description {
+        font-size: .9rem;
+        white-space: pre-wrap;
+        overflow-wrap: break-word;
+    }
+}
+
+.delete{
+    font-size: 1rem;
+}
+
+#delete-session-modal{
+    -webkit-animation: fadein 0.5s; /* Safari, Chrome and Opera > 12.1 */
+       -moz-animation: fadein 0.5s; /* Firefox < 16 */
+        -ms-animation: fadein 0.5s; /* Internet Explorer */
+         -o-animation: fadein 0.5s; /* Opera < 12.1 */
+            animation: fadein 0.5s;
+}
+
+@keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
+
+/* Firefox < 16 */
+@-moz-keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
+
+/* Safari, Chrome and Opera > 12.1 */
+@-webkit-keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
+
+/* Internet Explorer */
+@-ms-keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
+
+/* Opera < 12.1 */
+@-o-keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
+
+#delete-session {
+
+    &-modal-button {
+        font-size: .9rem;
+    }
+
+    &-close-modal-button {
+        background-color: transparent;
+        border: transparent;
+        color: rgba(#769FED, .4);
+        cursor: pointer;
+    }
+
+    &-close-modal-button:hover {
+        background-color: transparent;
+        border: transparent;
+        color:black;
+    }
+}
+
+.modal-text {
+    font-size: 1rem;
+}
+