single lightbox

sass/base.scss

@@ -299,7 +299,7 @@ $v-unit-6: 24rem;
     flex-direction: row;
     justify-content: space-between;
     align-items: center;
-    z-index: 3;
+    z-index: 3000;
     @media #{$smalldesktop} {
       height: 0;
       position: relative;
@@ -1525,7 +1525,70 @@ body.category.category-esemeny {
       }
     }
   }
-}
+  /* -------------------------------- lightbox -------------------------------- */
+
+  #cboxOverlay {
+    width: 100%;
+    height: 100%;
+    position: fixed;
+    top: 0;
+    left: 0;
+    background-color: #000;
+    z-index: 10;
+  }
+  #colorbox {
+    z-index: 12;
+    &:focus{
+      border: none;
+      outline: none;
+    }
+    #cboxContent {
+      #cboxTitle {
+        padding: 1rem;
+        @include captiontext();
+        -webkit-text-stroke: #fff 1px;
+        color: transparent;
+        width: 100%;
+        text-align: center;
+        
+      }
+      #cboxCurrent {
+        display: none !important;
+      }
+      button {
+        position: absolute;
+        background-repeat: no-repeat;
+        background-position: center;
+        background-size: 100%;
+        
+        &#cboxPrevious,
+        &#cboxNext {
+          background-image: url(../img/curvy_arrow.svg);
+          width: 2rem;
+          height: 4rem;
+          bottom: -5rem;
+          filter: invert(100);
+          z-index: 14;
+        }
+        &#cboxPrevious{
+          left: 1rem;
+          @include transform(scaleX(-1))
+        }
+        &#cboxNext {
+          right: 1rem;
+        }
+        &#cboxClose{
+          background-image: url(../img/dis-plus.svg);
+          width: 2rem;
+          height: 2rem;
+          @include transform(rotate(45deg));
+          top: -3rem;
+          right: 1rem;
+        }
+      }
+    }
+  }
+} //body.single end
 
 /* -------------------------------------------------------------------------- */
 /*                                 TAG COLORS                                 */