Update styles.css

PSIAIMS · Feb 20, 2024 · 7e9e75b · 7e9e75b
1 parent 129837a
commit 7e9e75b
Showing 1 changed file with 59 additions and 0 deletions.
diff --git a/styles.css b/styles.css
@@ -126,6 +126,65 @@
   clip-path: polygon(0 25%, 50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%);
 }
 
+.hex6{
+    width:230px;
+    height:230px;
+    background-color:#000000;
+    clip-path: polygon(0 25%, 50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%);
+    position: relative;
+    left: 100px;
+    margin: 0px 0px;
+    z-index: 1;
+}
+
+.hex6::before {
+  content: '';
+  position: absolute;
+  z-index: -1;
+  top: 5px; /* Half the width of the border */
+  left: 5px; /* Half the width of the border */
+  width: 220px;
+  height: 220px;
+  background-color: #0070C0;
+  clip-path: polygon(0 25%, 50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%);
+}
+
+.hex6::after {
+  content: '';
+  position: absolute;
+  z-index:2;
+  top: 5px; /* adjust values to fit your need */
+  left: -5px; /* adjust values to fit your need */
+  width: 10px; /* adjust values to fit your need */
+  height: 220px; /* adjust values to fit your need */
+  background-color: #000000;
+}
+
+.hex7{
+    width:230px;
+    height:230px;
+    background-color:#000000;
+    clip-path: polygon(0 25%, 50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%);
+    position: relative;
+    left: 100px;
+    margin: 0px 0px;
+    margin-left: -10px;
+    z-index: 1;
+}
+
+.hex7::before {
+  content: '';
+  position: absolute;
+  z-index: -1;
+  top: 5px; /* Half the width of the border */
+  left: 5px; /* Half the width of the border */
+  width: 220px;
+  height: 220px;
+  background-color:#BC8F00;
+  clip-path: polygon(0 25%, 50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%);
+}
+
+
 
 .long-hex{
  width: 200px;