/**
Theme Name: dezefy
Author: Dezefy LLC
Author URI: https://dezefy.com
Description: Custom Theme
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dezefy
Template: astra
*/

header .site-primary-header-wrap {
    margin-top: -50px;
    z-index: 100000;
    position: relative;
}

.ast-below-header-bar {
    border-top: 0px solid #8b611a;
}

.track-light-bar {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 70px;
    background: #020202;
    z-index: 10;
    margin-top: -9px;
}

.site-header-below-section-center.site-header-section.ast-flex.ast-grid-section-center {
    padding: 15px;
}

.ast-builder-menu .main-navigation>ul {
    gap: 8px;
}

.main-navigation.ast-inline-flex {
    border-radius: 50px;
    border: 1px solid #484848;
    background: #222222;
    padding: 8px;
}

.ast-builder-menu-1 .main-header-menu .menu-item > .menu-link {
    border-radius: 50px;
}

/* Solid black mounting bar */
.mounting-bar {
    background: #000;
    height: 10px;
    width: 100%;
    position: relative;
    z-index: 2;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}

.lights-container {
    display: flex;
    gap: 40px;
    justify-content: center;
    position: relative;
    z-index: 1;
    margin-top: -4px;
    padding: 0 20px;
    min-width: 1920px;
}

.light {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    position: relative;
    animation: colorShift 3s infinite;
    flex-shrink: 0;
}



/* Reflection on the wall */
.light::before {
    content: '';
    position: absolute;
    top: -33px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 60px;
    border-radius: 50%;
    opacity: 0.6;
    filter: blur(15px);
    animation: colorShiftReflection 3s infinite;
    z-index: -1;
}

.light:nth-child(1) { animation-delay: 0s; }
.light:nth-child(1)::before { animation-delay: 0s; }
.light:nth-child(2) { animation-delay: 0.1s; }
.light:nth-child(2)::before { animation-delay: 0.1s; }
.light:nth-child(3) { animation-delay: 0.2s; }
.light:nth-child(3)::before { animation-delay: 0.2s; }
.light:nth-child(4) { animation-delay: 0.3s; }
.light:nth-child(4)::before { animation-delay: 0.3s; }
.light:nth-child(5) { animation-delay: 0.4s; }
.light:nth-child(5)::before { animation-delay: 0.4s; }
.light:nth-child(6) { animation-delay: 0.5s; }
.light:nth-child(6)::before { animation-delay: 0.5s; }
.light:nth-child(7) { animation-delay: 0.6s; }
.light:nth-child(7)::before { animation-delay: 0.6s; }
.light:nth-child(8) { animation-delay: 0.7s; }
.light:nth-child(8)::before { animation-delay: 0.7s; }
.light:nth-child(9) { animation-delay: 0.8s; }
.light:nth-child(9)::before { animation-delay: 0.8s; }
.light:nth-child(10) { animation-delay: 0.9s; }
.light:nth-child(10)::before { animation-delay: 0.9s; }
.light:nth-child(11) { animation-delay: 1s; }
.light:nth-child(11)::before { animation-delay: 1s; }
.light:nth-child(12) { animation-delay: 1.1s; }
.light:nth-child(12)::before { animation-delay: 1.1s; }
.light:nth-child(13) { animation-delay: 1.2s; }
.light:nth-child(13)::before { animation-delay: 1.2s; }
.light:nth-child(14) { animation-delay: 1.3s; }
.light:nth-child(14)::before { animation-delay: 1.3s; }
.light:nth-child(15) { animation-delay: 1.4s; }
.light:nth-child(15)::before { animation-delay: 1.4s; }
.light:nth-child(16) { animation-delay: 1.5s; }
.light:nth-child(16)::before { animation-delay: 1.5s; }
.light:nth-child(17) { animation-delay: 1.6s; }
.light:nth-child(17)::before { animation-delay: 1.6s; }
.light:nth-child(18) { animation-delay: 1.7s; }
.light:nth-child(18)::before { animation-delay: 1.7s; }
.light:nth-child(19) { animation-delay: 1.8s; }
.light:nth-child(19)::before { animation-delay: 1.8s; }
.light:nth-child(20) { animation-delay: 1.9s; }
.light:nth-child(20)::before { animation-delay: 1.9s; }
.light:nth-child(21) { animation-delay: 2s; }
.light:nth-child(21)::before { animation-delay: 2s; }
.light:nth-child(22) { animation-delay: 2.1s; }
.light:nth-child(22)::before { animation-delay: 2.1s; }
.light:nth-child(23) { animation-delay: 2.2s; }
.light:nth-child(23)::before { animation-delay: 2.2s; }
.light:nth-child(24) { animation-delay: 2.3s; }
.light:nth-child(24)::before { animation-delay: 2.3s; }
.light:nth-child(25) { animation-delay: 2.4s; }
.light:nth-child(25)::before { animation-delay: 2.4s; }
.light:nth-child(26) { animation-delay: 2.5s; }
.light:nth-child(26)::before { animation-delay: 2.5s; }
.light:nth-child(27) { animation-delay: 2.6s; }
.light:nth-child(27)::before { animation-delay: 2.6s; }
.light:nth-child(28) { animation-delay: 2.7s; }
.light:nth-child(28)::before { animation-delay: 2.7s; }
.light:nth-child(29) { animation-delay: 2.8s; }
.light:nth-child(29)::before { animation-delay: 2.8s; }
.light:nth-child(30) { animation-delay: 2.9s; }
.light:nth-child(30)::before { animation-delay: 2.9s; }
.light:nth-child(31) { animation-delay: 3s; }
.light:nth-child(31)::before { animation-delay: 3s; }
.light:nth-child(32) { animation-delay: 3.1s; }
.light:nth-child(32)::before { animation-delay: 3.1s; }
.light:nth-child(33) { animation-delay: 3.2s; }
.light:nth-child(33)::before { animation-delay: 3.2s; }
.light:nth-child(34) { animation-delay: 3.3s; }
.light:nth-child(34)::before { animation-delay: 3.3s; }
.light:nth-child(35) { animation-delay: 3.4s; }
.light:nth-child(35)::before { animation-delay: 3.4s; }
.light:nth-child(36) { animation-delay: 3.5s; }
.light:nth-child(36)::before { animation-delay: 3.5s; }
.light:nth-child(37) { animation-delay: 3.6s; }
.light:nth-child(37)::before { animation-delay: 3.6s; }
.light:nth-child(38) { animation-delay: 3.7s; }
.light:nth-child(38)::before { animation-delay: 3.7s; }
.light:nth-child(39) { animation-delay: 3.8s; }
.light:nth-child(39)::before { animation-delay: 3.8s; }
.light:nth-child(40) { animation-delay: 3.9s; }
.light:nth-child(40)::before { animation-delay: 3.9s; }

@keyframes colorShift {
    0% {
        background-color: #ff0066;
        box-shadow: 0 0 10px #ff0066, 0 0 20px #ff0066, 0 0 30px #ff0066;
    }
    14% {
        background-color: #ff6600;
        box-shadow: 0 0 10px #ff6600, 0 0 20px #ff6600, 0 0 30px #ff6600;
    }
    28% {
        background-color: #ffcc00;
        box-shadow: 0 0 10px #ffcc00, 0 0 20px #ffcc00, 0 0 30px #ffcc00;
    }
    42% {
        background-color: #00ff66;
        box-shadow: 0 0 10px #00ff66, 0 0 20px #00ff66, 0 0 30px #00ff66;
    }
    57% {
        background-color: #00ccff;
        box-shadow: 0 0 10px #00ccff, 0 0 20px #00ccff, 0 0 30px #00ccff;
    }
    71% {
        background-color: #0066ff;
        box-shadow: 0 0 10px #0066ff, 0 0 20px #0066ff, 0 0 30px #0066ff;
    }
    85% {
        background-color: #cc00ff;
        box-shadow: 0 0 10px #cc00ff, 0 0 20px #cc00ff, 0 0 30px #cc00ff;
    }
    100% {
        background-color: #ff0066;
        box-shadow: 0 0 10px #ff0066, 0 0 20px #ff0066, 0 0 30px #ff0066;
    }
}

@keyframes colorShiftReflection {
    0% {
        background-color: #ff0066;
    }
    14% {
        background-color: #ff6600;
    }
    28% {
        background-color: #ffcc00;
    }
    42% {
        background-color: #00ff66;
    }
    57% {
        background-color: #00ccff;
    }
    71% {
        background-color: #0066ff;
    }
    85% {
        background-color: #cc00ff;
    }
    100% {
        background-color: #ff0066;
    }
}