in-class exercise

projects/project-02/css/style.css

@@ -1,170 +1,170 @@
-
-
-body {
-    font-family: 'Nunito Sans', sans-serif;
-    height: 100%;
-}
-
-header {
-    display: block;
-    font-size: 10pt;
-    overflow: hidden;
-
-    position: fixed; /* Set the navbar to fixed position */
-    top: 0; /* Position the navbar at the top of the page */
-    width: 100%;
-}
-
-* {
-    padding: 0;
-    margin: 0;
-    box-sizing: border-box;
-}
-
-ul.container {
-display: flex;
-flex-wrap: nowrap;
-justify-content: space-around;
-list-style: none;
-background: white;
-margin: 0;
-line-height: 60px;
-}
-
-ul {
-    display: block;
-    list-style-type: disc;
-    margin-block-start: 1em;
-    margin-block-end: 1em;
-    margin-inline-start: 0px;
-    margin-inline-end: 0px;
-    padding-inline-start: 40px;
-}
-
-a:link { text-decoration: none; color: black;}
-
-
-a:visited { text-decoration: none; color: black;}
-
-
-a:hover { text-decoration: none; }
-
-
-a:active { text-decoration: none; }
-
-li {
-display: list-item;
-text-align: -webkit-match-parent;
-list-style: none;
-text-decoration: none;
-}
-
-.homeicon{
-    width: 8%;
-    height: 8%;
-    object-fit: cover;
-}
-
-.grid-container {
-    margin: 20px;
-    display: grid;
-    grid-template-columns: repeat(4, 1fr);
-    grid-template-rows: repeat(6, 1fr);
-    grid-gap: 20px;
-}
-
-
-
-.figure{
-    display: block;
-    margin-block-start: 1em;
-    margin-block-end: 1em;
-    margin-inline-start: 40px;
-    margin-inline-end: 40px;
-
-}
-
-video {
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-}
-
-
-
-.item{
-    width: 100%;
-    height: 80%;
-    object-fit: cover;
-}
-
-
-.item--1{
-
-
-
-    grid-column-start: 1;
-    grid-column-end: 2;
-
-    grid-row-start: 1;
-    grid-row-end: 3;
-}
-
-.item--2{
-
-
-
-    grid-column-start: 3;
-    grid-column-end: 4;
-
-    grid-row-start: 1;
-    grid-row-end: 3;
-}
-
-.item--3{
-
-
-
-    grid-column-start: 1;
-    grid-column-end: 2;
-
-    grid-row-start: 3;
-    grid-row-end: 5;
-}
-
-
-
-.item--4{
-
-
-    grid-column-start: 3;
-    grid-column-end: 4;
-
-    grid-row-start: 3;
-    grid-row-end: 5;
-}
-
-.item--5{
-
-
-    grid-column-start: 1;
-    grid-column-end: 2;
-
-    grid-row-start: 5;
-    grid-row-end: 7;
-}
-
-.item--6{
-
-
-    grid-column-start: 3;
-    grid-column-end: 4;
-
-    grid-row-start: 5;
-    grid-row-end: 7;
-}
-
-footer{
-    font-size: 8pt;
-    color: grey
+
+
+body {
+    font-family: 'Nunito Sans', sans-serif;
+    height: 100%;
+}
+
+header {
+    display: block;
+    font-size: 10pt;
+    overflow: hidden;
+
+    position: fixed; /* Set the navbar to fixed position */
+    top: 0; /* Position the navbar at the top of the page */
+    width: 100%;
+}
+
+* {
+    padding: 0;
+    margin: 0;
+    box-sizing: border-box;
+}
+
+ul.container {
+display: flex;
+flex-wrap: nowrap;
+justify-content: space-around;
+list-style: none;
+background: white;
+margin: 0;
+line-height: 60px;
+}
+
+ul {
+    display: block;
+    list-style-type: disc;
+    margin-block-start: 1em;
+    margin-block-end: 1em;
+    margin-inline-start: 0px;
+    margin-inline-end: 0px;
+    padding-inline-start: 40px;
+}
+
+a:link { text-decoration: none; color: black;}
+
+
+a:visited { text-decoration: none; color: black;}
+
+
+a:hover { text-decoration: none; }
+
+
+a:active { text-decoration: none; }
+
+li {
+display: list-item;
+text-align: -webkit-match-parent;
+list-style: none;
+text-decoration: none;
+}
+
+.homeicon{
+    width: 8%;
+    height: 8%;
+    object-fit: cover;
+}
+
+.grid-container {
+    margin: 20px;
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    grid-template-rows: repeat(6, 1fr);
+    grid-gap: 20px;
+}
+
+
+
+.figure{
+    display: block;
+    margin-block-start: 1em;
+    margin-block-end: 1em;
+    margin-inline-start: 40px;
+    margin-inline-end: 40px;
+
+}
+
+video {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+
+
+.item{
+    width: 100%;
+    height: 80%;
+    object-fit: cover;
+}
+
+
+.item--1{
+
+
+
+    grid-column-start: 1;
+    grid-column-end: 2;
+
+    grid-row-start: 1;
+    grid-row-end: 3;
+}
+
+.item--2{
+
+
+
+    grid-column-start: 3;
+    grid-column-end: 4;
+
+    grid-row-start: 1;
+    grid-row-end: 3;
+}
+
+.item--3{
+
+
+
+    grid-column-start: 1;
+    grid-column-end: 2;
+
+    grid-row-start: 3;
+    grid-row-end: 5;
+}
+
+
+
+.item--4{
+
+
+    grid-column-start: 3;
+    grid-column-end: 4;
+
+    grid-row-start: 3;
+    grid-row-end: 5;
+}
+
+.item--5{
+
+
+    grid-column-start: 1;
+    grid-column-end: 2;
+
+    grid-row-start: 5;
+    grid-row-end: 7;
+}
+
+.item--6{
+
+
+    grid-column-start: 3;
+    grid-column-end: 4;
+
+    grid-row-start: 5;
+    grid-row-end: 7;
+}
+
+footer{
+    font-size: 8pt;
+    color: grey
 }