.halloween #logo {
    height: 34px;
    width: 148px;
    margin: 9px 13px 17px;
}
.halloween header .container {
    background-color: #1e093b;
}
.halloween #mini-cart #mini-cart-s {
    border-color: #1e093b;
}
.halloween #navbar-toggle-wrapper button {
    color: #ee6e03;
}
@media (min-width: 992px) {
    .halloween #logo {
        height: 40px;
        width: 174px;
        margin: 18px 20px;
    }
    .halloween header .container {
        background-color: rgba(255,255,255,0.1);
        border: 1px solid rgba(255,255,255,0.05);
        height: 128px;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
    .halloween #JoeMenu {
        background-color: rgba(255,255,255,0.06);
    }
}

.halloween .hero {
    background-color: #1e093b;
}
    .halloween .hero .content_area {
        background-image: url(https://cdn.experiences.co.uk/cdn-cgi/image/format=auto,fit=contain/imgs/themes/halloween/hero-mobile.jpg) !important;
        padding: 250px 10px 0;
        height: calc(100% - 250px);
    }
.halloween .hero .content_area .tag {
    border-color: #ee6e03;
    background-color: transparent;
}
.halloween .hero .btn-secondary:hover {
    background-color: #ff7e00;
    box-shadow: 0px 25px 20px 0px rgba(238,110,3,0.15);
}
.halloween .hero .btn-secondary {
    background-color: #ee6e03;
    border: 1px solid #ee6e03;
    color: #fefefe;
}
.halloween .hero .content_area .btn i {
    background-color: #1e093b;
}
@media (min-width: 768px) {
    .halloween .hero .content_area {
        background-image: url(https://cdn.experiences.co.uk/cdn-cgi/image/format=auto,fit=contain/imgs/themes/halloween/hero.jpg) !important;
        padding: 50px 0 40px;
    }
}
@media (min-width: 992px) {
    .halloween .hero .content_area {
        margin: 0 auto;
        padding: 220px 0 70px;
    }
}

.spider-container {
    animation: spider-anima 12s ease-out infinite;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
@keyframes spider-anima {
    0% {
        top: -100px;
    }

    50% {
        top: 50%;
    }

    100% {
        top: -100px;
    }
}
.spider-container .eye {
    background-color: #ee6e03;
    height: 1px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
}
.spider-container .eye-right {
    right: 6px;
}
.spider-container .eye-left {
    left: 6px;
}
.spider-web {
    animation: spider-web-anima 12s ease-out infinite;
    background-color: #08021a;
    border-radius: 4px;
    height: 0;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 2px;
    z-index: 1;
}
@keyframes spider-web-anima {
    0% {
        height: 0;
        top: -100px;
    }

    50% {
        height: 50%;
        top: 0;
    }

    100% {
        height: 0;
        top: -100px;
    }
}
.spider-body {
    background-color: #08021a;
    border-radius: 50%;
    height: 20px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 20px;
}
.spider-body:before {
    content: "";
    background-color: #08021a;
    border-radius: 50%;
    height: 15px;
    left: 2.5px;
    position: absolute;
    top: -5px;
    width: 15px;
    z-index: -99;
}
.right {
    transform: rotateY(180deg);
}
.arm-container .arm {
    background-color: #08021a;
    border-radius: 4px;
    height: 4px;
    position: absolute;
    transform-origin: center left;
    width: 30px;
}
.arm-container .A {
    animation: A-anima 3s infinite ease-in-out;
    transform: rotate(75deg);
}
@keyframes A-anima {
    0% {
        transform: rotate(75deg);
    }

    50% {
        transform: rotate(-70deg);
    }
}
.arm-container .A:nth-child(2) {
    animation-delay: -0.2s;
}
.arm-container .A:nth-child(3) {
    animation-delay: -0.5s;
}
.arm-container .A:nth-child(4) {
    animation-delay: -0.4s;
}
.arm-container .B {
    animation: B-anima 3s infinite ease-in-out;
    left: calc(100% - 2px);
    transform: rotate(10deg);
}
@keyframes B-anima {
    0% {
        transform: rotate(10deg);
    }

    50% {
        transform: rotate(120deg);
    }

    80% {
        transform: rotate(20deg);
    }
}
.arm-container .C {
    animation: C-anima 3s infinite ease-in-out;
    left: calc(100% - 2px);
    transform: rotate(10deg);
}
@keyframes C-anima {
    0% {
        transform: rotate(10deg);
    }

    50% {
        transform: rotate(90deg);
    }

    80% {
        transform: rotate(10deg);
    }
}


@media (min-width: 768px) {
    .halloween .gen-title:before {
        background: #1e093b;
    }
    .halloween .breadcrumb a {
        color: #ee6e03;
    }
}

.halloween footer {
    background-color: #1e093b;
}
.halloween footer .f-r .f-c:first-child ul li i {
    color: #ee6e03;
}
@media (min-width: 768px) {
    .halloween footer #footer_logo {
        height: 40px;
        width: 174px;
        margin: -8px 0 48px;
    }
}

.halloween .strap {
    background-color: #0f042e;
}
.halloween .strap:before {
    display: none;
}