.bg {

    
    pointer-events: all;
    position: relative;
    top: 0;
    margin: 0;
    /* cursor: none; */
    

}

.hexagon {
    width: 80px ;
    height: 80px;
    margin-left: 2.25px;
    margin-right: 2.25px;
    margin-bottom: 3.5px;
    /* margin-left: 3px; */
    /* margin-bottom: 3px; */
    background: #111;
    /* border: #0f0 solid; */
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    animation: rgb 4s linear infinite;
    transition: 15s;
}
.hexagon- {
    width: 80px ;
    height: 80px;
    margin-right: 1px;
    margin-left: 1px;
    /* margin-bottom: 3px; */
    background: #111;
    /* border: #0f0 solid; */
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    animation: rgb 4s linear infinite;
    transition: 15s;
}
.-hexagon {
    width: 80px ;
    height: 80px;
    margin-left: 1px;
    /* margin-left: 3px; */
    margin-bottom: 3px;
    background: #111;
    /* border: #0f0 solid; */
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    animation: rgb 4s linear infinite;
    transition: 15s;
}
.-hexagon:hover,
.hexagon:hover,
.hexagon-:hover {
    background: #0f0;
    transition: 0s;
}
.-hexagon:active,
.hexagon:active,
.hexagon-:active {
    animation: rgb 4s linear infinite;
}
.-hexagon::before,
.hexagon::before,
.hexagon-::before {
    content: '';
    position: absolute;
    width: 50%;
    height: 100%;
    background-color: #ffffff05;
    z-index: 2;
}
.-hexagon::after,
.hexagon::after,
.hexagon-::after {
    content: '';
    position: absolute;
    top: .1875rem;
    bottom: .1875rem;
    left: .1875rem;
    right: .1875rem;
    background: #111;
    clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}
.hexRow01 {
    display: flex;
    margin-top: -1.75rem;
    margin-bottom: 1px;
    /* margin-left: 1px; */
    /* margin-bottom: -1.75rem; */
    /* margin-right: -3.75rem; */
}
.hexRow02, .hexRow04, .hexRow06, .hexRow08, .hexRow10 {
    display: flex;
    margin-top: -20px;
    margin-left: 40px;
    /* margin-bottom: -1.75rem; */
    /* margin-right: -3.75rem; */
}
.hexRow03,.hexRow05, .hexRow07, .hexRow09 {
    display: flex;
    margin-top: -20px;
    margin-bottom: 1px;
    /* margin-left: -58.5px; */
    /* margin-bottom: -1.75rem; */
    /* margin-right: -3.75rem; */
}
.hexRow11 {
    display: flex;
    margin-top: -20px;
    margin-bottom: 20px;
}
@keyframes rgb {
    0% {
        filter: hue-rotate(0deg);
    }
    50% {
        filter: hue-rotate(180deg);
    }
    100% {
        filter: hue-rotate(360deg);
    }
}

.main.pageWrapper {
    margin: 0 auto 0;
    padding: .625rem;
    max-width: 90rem;
}

.pageWrapper:hover {
    pointer-events: none;
}

.contentWrapper {
    pointer-events: none;
}

/* .cursor {

    
    z-index: 9999;
    width: 1.25rem;
    height:1.25rem;
    position: fixed;
    background: #2696e8;
    border-radius: 40%;
    pointer-events: none;
    box-shadow: 
        0 0 1.25rem #2696e8,
        0 0 3.75rem #2696e8,
        0 0 6.25rem #2696e8;
    animation: cursor 5s infinite;
    transform: translate(-50%, -50%);
    display: none;
    

}

.cursor::before {

    
    content: '';
    position: absolute;
    background: #2696e8;
    height: 3.125rem;
    width: 3.125rem;
    opacity: 0.2;
    transform: translate(-30%, -30%);
    border-radius: 50%;
    

} */

#trailer {
    height: 20px;
    width: 20px;
    background: #269368;
    border-radius: 20px;
    
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 10000;
    
    pointer-events: none;
    opacity: 0;
    transition: opacity 500ms ease-in-out !important;
    /* transition: 15s ease-in-out; */
    
    display: grid;
    place-items: center;
    animation: cursor 5s linear infinite;
}

#trailer:not([data-type=""]) > #trailer-icon {
    opacity: 1;
}

#trailer-icon {
    font-size: 6px;
    line-height: 4px;
    
    opacity: 0;
    transition: opacity 400ms ease;
}

@keyframes cursor {

    
    0% {
        filter: hue-rotate(0deg);
    }
    50% {
        filter: hue-rotate(180deg);
    }
    100%{
        filter: hue-rotate(360deg);
    }
    

}