@import url('https://bengalwebsolution.com/helix/cdn/common/?v6,900px');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

:root
{
    --c1: 233, 243, 86;
    --c2: 77, 225, 252;
    --c3: 250, 117, 195;
    --c4: 56, 216, 64;
    --c5: 255, 107, 107;
    --c6: 179, 160, 248;
    --c7: 235, 161, 64;
    --c8: 24, 20, 45; /* 31, 25, 49; */
    --c9: 171, 228, 39;
    --c10: 57, 53, 73;
    --c11: 90, 177, 255;
    --c12: 20, 200, 175;
    --c13: 128, 128, 255;
    --c14: 255, 39, 105;
    --lite: #302c42;
    --f1: 'Rubik', sans-serif;
    --f2: 'Roboto Slab', serif;
    --bgcolor: var(--c8);
    --txtcolor: var(--w);
}

body
{
    background-color: rgba(var(--bgcolor), var(--bcalpha));
    color: rgba(var(--txtcolor), var(--calpha));
}

@media only screen
{
    .checkbox .fa-check-square, .select ~ i, .theComment a, .feedPost a
    {
        color: rgba(var(--accent), var(--calpha));
    }

    .theComment a, .feedPost article a
    {
        text-decoration: underline;
    }
    
    .borderaccent
    {
        border-color: rgba(var(--accent), var(--calpha));
    }

    [data-link] *, [data-action] *, .peNone *
    {
        pointer-events: none;
    }

    .switch input:not(:checked) ~ span
    {
        background-color: rgba(var(--w), 0.2);
    }

    .switch input:checked ~ span
    {
        background-color: rgba(var(--accent), 0.82);
    }

    .blite
    {
        background-color: var(--lite);
    }

    .overcon
    {
        z-index: 10;
    }

    .overlay
    {
        width: calc(16rem + 18%);
    }

    .overlayImageCon > img
    {
        max-width: calc(100vw - 4rem);
        max-height: calc(100vh - 4rem);
    }

    header, nav
    {
        z-index: 2;
    }

    nav a
    {
        display: inherit;
    }

    nav a::before, nav button::before
    {
        content: "";
        opacity: 0;
        background-color: rgba(var(--accent), var(--bcalpha));
        position: absolute;
        top: 0px;
    }

    nav a:hover::before, nav button:hover::before, nav a.active::before
    {
        opacity: 1;
    }

    nav a:hover i, nav button:hover i, nav a.active i
    {
        color: rgba(var(--accent), var(--calpha));
    }

    .view.upcoming
    {
        -webkit-transform: translate3d(2rem, 0, 0);
        -moz-transform: translate3d(2rem, 0, 0);
        -o-transform: translate3d(2rem, 0, 0);
        -ms-transform: translate3d(2rem, 0, 0);
        transform: translate3d(2rem, 0, 0);
    }

    .view.left
    {
        -webkit-transform: translate3d(-2rem, 0, 0);
        -moz-transform: translate3d(-2rem, 0, 0);
        -o-transform: translate3d(-2rem, 0, 0);
        -ms-transform: translate3d(-2rem, 0, 0);
        transform: translate3d(-2rem, 0, 0);
    }

    .view.active
    {
        visibility: visible;
    }

    .view:not(.active)
    {
        visibility: hidden;
    }

    .bbcustom
    {
        border-bottom: 0.125rem dotted rgba(var(--txtcolor), var(--calpha));
    }

    .unx
    {
        -webkit-border-radius: 0px 0px 0px 0.5rem;
        -moz-border-radius: 0px 0px 0px 0.5rem;
        -o-border-radius: 0px 0px 0px 0.5rem;
        -ms-border-radius: 0px 0px 0px 0.5rem;
        border-radius: 0px 0px 0px 0.5rem;
    }

    .unx, .prfimgctrl
    {
        -webkit-transform: translate3d(0px, 2rem, 0rem);
        -moz-transform: translate3d(0px, 2rem, 0rem);
        -o-transform: translate3d(0px, 2rem, 0rem);
        -ms-transform: translate3d(0px, 2rem, 0rem);
        transform: translate3d(0px, 2rem, 0rem);
    }

    .unx.show, .prfimgctrl.show
    {
        -webkit-transform: translate3d(0px, 0rem, 0rem);
        -moz-transform: translate3d(0px, 0rem, 0rem);
        -o-transform: translate3d(0px, 0rem, 0rem);
        -ms-transform: translate3d(0px, 0rem, 0rem);
        transform: translate3d(0px, 0rem, 0rem);
    }

    .gtcac
    {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, calc(16rem + 20%)), 1fr));
    }

    .gtcfeed
    {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, calc(16rem + 16%)), 1fr));
    }
    
    .sldx.quickshow
    {
        right: 1rem;
        max-width: min(calc(100% - 2rem), calc(16rem + 20%));
        z-index: 4;
        -webkit-animation-fill-mode: both;
        -moz-animation-fill-mode: both;
        -o-animation-fill-mode: both;
        -ms-animation-fill-mode: both;
        animation-fill-mode: both;
        -webkit-animation: sldx 5s 0s ease 1;
        -moz-animation: sldx 5s 0s ease 1;
        -o-animation: sldx 5s 0s ease 1;
        -ms-animation: sldx 5s 0s ease 1;
        animation: sldx 5s 0s ease 1;
    }

    .tbedx::before
    {
        content: "";
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 100%;
        height: var(--befh);
        background-color: rgba(var(--accent), 0.12);
        background-image: -webkit-radial-gradient(circle at center, rgba(var(--accent), 0.4) 0%, rgba(var(--accent), 0.4) 25%, transparent 25%, transparent);
        background-image: radial-gradient(circle at center, rgba(var(--accent), 0.4) 0%, rgba(var(--accent), 0.4) 25%, transparent 25%, transparent);
        background-size: 6px 6px;
    }

    .adrhrotate
    {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
        letter-spacing: 0.0625rem;
    }

    .adrhrotate, .adhrl
    {
        -moz-writing-mode: tb-rl;
        -webkit-writing-mode: tb-rl;
        -o-writing-mode: tb-rl;
        -ms-writing-mode: tb-rl;
        writing-mode: tb-rl;
    }

    .autoxwidth
    {
        width: min(calc(18rem + 34%), 100%);
    }

    .txtmsg
    {
        width: calc(100% - 3.5rem);
    }

    .feedbgtxt, .flashbgtxt
    {
        background-size: cover;
        background-position: center;
    }

    .feedbgtxt::before
    {
        content: "";
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background-color: rgba(var(--b), 0.34);
    }

    .newssnap::before
    {
        content: "";
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background-image: var(--newsimg);
        background-size: cover;
        background-position: center center;
        opacity: 0.68;
        -webkit-filter: blur(0.5rem);
        filter: blur(0.5rem);
    }

    .feedgenbg, .flashgenbg
    {
        background-image: -webkit-repeating-conic-gradient(from 4deg at var(--coordinate), rgba(var(--accent), 0.28) 0deg 15deg, rgba(var(--c10), 0.74) 10deg 30deg);
        background-image: repeating-conic-gradient(from 4deg at var(--coordinate), rgba(var(--accent), 0.28) 0deg 15deg, rgba(var(--c10), 0.74) 10deg 30deg);
    }
    
    .flashgenbg p
    {
        max-height: 100%;
        display: -webkit-box;
        -webkit-line-clamp: 7;
        -webkit-box-orient: vertical;
    }

    .feedHomeText p
    {
        max-height: 100%;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
    }

    .darkOl::after
    {
        content: "";
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background: -moz-linear-gradient(180deg, rgba(57,53,73,0) 0%, rgba(57,53,73,0) 80%, rgba(57,53,73,0.8) 100%);
        background: -webkit-linear-gradient(180deg, rgba(57,53,73,0) 0%, rgba(57,53,73,0) 80%, rgba(57,53,73,0.8) 100%);
        background: linear-gradient(180deg, rgba(57,53,73,0) 0%, rgba(57,53,73,0) 80%, rgba(57,53,73,0.8) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1); 
    }

    .z1
    {
        z-index: 1;
    }

    @-webkit-keyframes sldx
    {
        0%, 100% {-webkit-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -moz-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -o-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -ms-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); transform: translate3d(calc(100% + 1rem), 0rem, 0rem);}
        5%, 95% {-webkit-transform: translate3d(0rem, 0rem, 0rem); -moz-transform: translate3d(0rem, 0rem, 0rem); -o-transform: translate3d(0rem, 0rem, 0rem); -ms-transform: translate3d(0rem, 0rem, 0rem); transform: translate3d(0rem, 0rem, 0rem);}
    }

    @-moz-keyframes sldx
    {
        0%, 100% {-webkit-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -moz-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -o-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -ms-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); transform: translate3d(calc(100% + 1rem), 0rem, 0rem);}
        5%, 95% {-webkit-transform: translate3d(0rem, 0rem, 0rem); -moz-transform: translate3d(0rem, 0rem, 0rem); -o-transform: translate3d(0rem, 0rem, 0rem); -ms-transform: translate3d(0rem, 0rem, 0rem); transform: translate3d(0rem, 0rem, 0rem);}
    }

    @-o-keyframes sldx
    {
        0%, 100% {-webkit-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -moz-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -o-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -ms-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); transform: translate3d(calc(100% + 1rem), 0rem, 0rem);}
        5%, 95% {-webkit-transform: translate3d(0rem, 0rem, 0rem); -moz-transform: translate3d(0rem, 0rem, 0rem); -o-transform: translate3d(0rem, 0rem, 0rem); -ms-transform: translate3d(0rem, 0rem, 0rem); transform: translate3d(0rem, 0rem, 0rem);}
    }

    @-ms-keyframes sldx
    {
        0%, 100% {-webkit-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -moz-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -o-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -ms-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); transform: translate3d(calc(100% + 1rem), 0rem, 0rem);}
        5%, 95% {-webkit-transform: translate3d(0rem, 0rem, 0rem); -moz-transform: translate3d(0rem, 0rem, 0rem); -o-transform: translate3d(0rem, 0rem, 0rem); -ms-transform: translate3d(0rem, 0rem, 0rem); transform: translate3d(0rem, 0rem, 0rem);}
    }

    @keyframes sldx
    {
        0%, 100% {-webkit-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -moz-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -o-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); -ms-transform: translate3d(calc(100% + 1rem), 0rem, 0rem); transform: translate3d(calc(100% + 1rem), 0rem, 0rem);}
        5%, 95% {-webkit-transform: translate3d(0rem, 0rem, 0rem); -moz-transform: translate3d(0rem, 0rem, 0rem); -o-transform: translate3d(0rem, 0rem, 0rem); -ms-transform: translate3d(0rem, 0rem, 0rem); transform: translate3d(0rem, 0rem, 0rem);}
    }
}

@media only screen and (min-width: 901px)
{
    header
    {
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
    }

    nav
    {
        top: 6rem;
        left: 0px;
        height: calc(100% - 6rem);
        width: 14rem;
        overflow: hidden;
    }

    nav ul
    {
        width: 100%;
        overflow: auto;
    }

    nav li
    {
        overflow: hidden;
    }

    nav.min
    {
        width: 4rem;
    }

    nav a::before, nav button::before
    {
        left: 0.5rem;
        width: 3rem;
        height: 3rem;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -o-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
    }

    .sitenav::-webkit-scrollbar
    {
        display: none;
    }

    .sitenav, .nobars
    {
        height: calc(100% - 4.625rem);
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    
    main, footer
    {
        width: calc(100% - 14rem);
        left: 14rem;
    }

    nav.min ~ main, nav.min ~ footer
    {
        width: calc(100% - 4rem);
        left: 4rem;
    }

    .feedAc
    {
        min-width: 20rem;
    }

    .feedbgtxt
    {
        min-height: min(calc((((100vw - 14rem) * 60 / 100) - 4rem) * var(--imgH) / var(--imgW)), calc(100vh - 16rem));
    }

    nav.min ~ main .feedbgtxt
    {
        min-height: min(calc((((100vw - 4rem) * 60 / 100) - 4rem) * var(--imgH) / var(--imgW)), calc(100vh - 16rem));
    }

    .feedgenbg
    {
        min-height: min(calc((((100vw - 14rem) * 60 / 100) - 4rem) / 2), calc(100vh - 16rem));
    }

    nav.min ~ main .feedgenbg
    {
        min-height: min(calc((((100vw - 4rem) * 60 / 100) - 4rem) / 2), calc(100vh - 16rem));
    }

    main
    {
        margin-top: 6rem;
    }

    .view, .fillMain
    {
        min-height: calc(100vh - 8.5625rem);
    }

    .dpcon
    {
        min-width: 10rem;
    }

    .wrtfcon
    {
        bottom: 2.875rem;
    }

    .commCon
    {
        top: 8rem;
    }
}

@media only screen and (max-width: 900px)
{
    footer
    {
        margin-bottom: 3.125rem;
    }

    nav
    {
        bottom: 0px;
        left: 0px;
        width: 100vw;
        max-width: 100vw;
        overflow: auto;
        text-align: center;
    }

    nav ul
    {
        white-space: nowrap;
    }

    nav li
    {
        display: inline-block;
        width: 4rem;
        text-align: center;
    }

    nav a::before, nav button::before
    {
        left: 0px;
        width: 100%;
        height: 100%;
    }

    nav span
    {
        position: absolute;
        bottom: 0px;
        left: 50%;
        width: 100%;
        font-size: 0.74rem;
        font-weight: 500;
        line-height: 1rem;
        white-space: normal;
        color: rgba(var(--accent), var(--calpha));
        opacity: 0;
        -webkit-transform: translate3d(-50%, 0px, 0px);
        -moz-transform: translate3d(-50%, 0px, 0px);
        -o-transform: translate3d(-50%, 0px, 0px);
        -ms-transform: translate3d(-50%, 0px, 0px);
        transform: translate3d(-50%, 0px, 0px);
    }

    nav a.active span
    {
        -webkit-animation: move1 1s 0s linear 1;
        -moz-animation: move1 1s 0s linear 1;
        -o-animation: move1 1s 0s linear 1;
        -ms-animation: move1 1s 0s linear 1;
        animation: move1 1s 0s linear 1;
    }

    nav a.active i
    {
        -webkit-animation: opacity1 1s 0s linear 1;
        -moz-animation: opacity1 1s 0s linear 1;
        -o-animation: opacity1 1s 0s linear 1;
        -ms-animation: opacity1 1s 0s linear 1;
        animation: opacity1 1s 0s linear 1;
    }

    .view:not(.active)
    {
        width: calc(100% - 2rem);
    }

    .view, .fillMain
    {
        min-height: calc(100vh - 11.6875rem);
    }

    .dpcon
    {
        min-width: 6rem;
    }

    .wrtfcon
    {
        bottom: 6rem;
    }

    .feedbgtxt
    {
        min-height: min(calc(((100vw - 2rem) - 4rem) * var(--imgH) / var(--imgW)), calc(100vh - 2rem));
    }

    .feedgenbg
    {
        min-height: min(calc(((100vw - 2rem) - 4rem) / 2), calc(100vh - 2rem));
    }

    .commCon
    {
        top: 1rem;
    }

    @-webkit-keyframes move1
    {
        0% {-webkit-transform: translate3d(-50%, 0px, 0px); -moz-transform: translate3d(-50%, 0px, 0px); -o-transform: translate3d(-50%, 0px, 0px); -ms-transform: translate3d(-50%, 0px, 0px); transform: translate3d(-50%, 0px, 0px); opacity: 0;}
        25%, 75% {opacity: 1;}
        100% {-webkit-transform: translate3d(-50%, -1rem, 0px); -moz-transform: translate3d(-50%, -1rem, 0px); -o-transform: translate3d(-50%, -1rem, 0px); -ms-transform: translate3d(-50%, -1rem, 0px); transform: translate3d(-50%, -1rem, 0px); opacity: 0;}
    }

    @-moz-keyframes move1
    {
        0% {-webkit-transform: translate3d(-50%, 0px, 0px); -moz-transform: translate3d(-50%, 0px, 0px); -o-transform: translate3d(-50%, 0px, 0px); -ms-transform: translate3d(-50%, 0px, 0px); transform: translate3d(-50%, 0px, 0px); opacity: 0;}
        25%, 75% {opacity: 1;}
        100% {-webkit-transform: translate3d(-50%, -1rem, 0px); -moz-transform: translate3d(-50%, -1rem, 0px); -o-transform: translate3d(-50%, -1rem, 0px); -ms-transform: translate3d(-50%, -1rem, 0px); transform: translate3d(-50%, -1rem, 0px); opacity: 0;}
    }

    @-o-keyframes move1
    {
        0% {-webkit-transform: translate3d(-50%, 0px, 0px); -moz-transform: translate3d(-50%, 0px, 0px); -o-transform: translate3d(-50%, 0px, 0px); -ms-transform: translate3d(-50%, 0px, 0px); transform: translate3d(-50%, 0px, 0px); opacity: 0;}
        25%, 75% {opacity: 1;}
        100% {-webkit-transform: translate3d(-50%, -1rem, 0px); -moz-transform: translate3d(-50%, -1rem, 0px); -o-transform: translate3d(-50%, -1rem, 0px); -ms-transform: translate3d(-50%, -1rem, 0px); transform: translate3d(-50%, -1rem, 0px); opacity: 0;}
    }

    @-ms-keyframes move1
    {
        0% {-webkit-transform: translate3d(-50%, 0px, 0px); -moz-transform: translate3d(-50%, 0px, 0px); -o-transform: translate3d(-50%, 0px, 0px); -ms-transform: translate3d(-50%, 0px, 0px); transform: translate3d(-50%, 0px, 0px); opacity: 0;}
        25%, 75% {opacity: 1;}
        100% {-webkit-transform: translate3d(-50%, -1rem, 0px); -moz-transform: translate3d(-50%, -1rem, 0px); -o-transform: translate3d(-50%, -1rem, 0px); -ms-transform: translate3d(-50%, -1rem, 0px); transform: translate3d(-50%, -1rem, 0px); opacity: 0;}
    }

    @keyframes move1
    {
        0% {-webkit-transform: translate3d(-50%, 0px, 0px); -moz-transform: translate3d(-50%, 0px, 0px); -o-transform: translate3d(-50%, 0px, 0px); -ms-transform: translate3d(-50%, 0px, 0px); transform: translate3d(-50%, 0px, 0px); opacity: 0;}
        25%, 75% {opacity: 1;}
        100% {-webkit-transform: translate3d(-50%, -1rem, 0px); -moz-transform: translate3d(-50%, -1rem, 0px); -o-transform: translate3d(-50%, -1rem, 0px); -ms-transform: translate3d(-50%, -1rem, 0px); transform: translate3d(-50%, -1rem, 0px); opacity: 0;}
    }

    @-webkit-keyframes opacity1
    {
        0%, 100%{opacity: 1;}
        25%, 75%{opacity: 0.24;}
    }

    @-moz-keyframes opacity1
    {
        0%, 100%{opacity: 1;}
        25%, 75%{opacity: 0.24;}
    }

    @-o-keyframes opacity1
    {
        0%, 100%{opacity: 1;}
        25%, 75%{opacity: 0.24;}
    }

    @-ms-keyframes opacity1
    {
        0%, 100%{opacity: 1;}
        25%, 75%{opacity: 0.24;}
    }

    @keyframes opacity1
    {
        0%, 100%{opacity: 1;}
        25%, 75%{opacity: 0.24;}
    }
}

@media only screen and (min-width: 901px) and (max-width: 1240px)
{
    .feedHead
    {
        flex-direction: column;
        align-items: flex-start;
        align-items: start;
    }

    .feedBtns
    {
        justify-content: center;
        margin-top: 1rem;
        margin-left: 0px;
        width: 100%;
    }

    .feedBtns > *
    {
        flex-grow: 1;
    }

    .theComment p
    {
        padding: 0.25rem;
    }
}

@media only screen and (max-width: 900px) and (min-width: 601px)
{
    .feedAc
    {
        min-width: 20rem;
    }
}

@media only screen and (max-width: 600px)
{
    .feedHead
    {
        flex-direction: column;
        align-items: flex-start;
        align-items: start;
    }

    .feedBtns
    {
        justify-content: center;
        margin-top: 1rem;
        margin-left: 0px;
        width: 100%;
    }

    .feedBtns > *
    {
        flex-grow: 1;
    }

    .servHeadFlex
    {
        flex-direction: column;
        align-items: flex-start;
    }

    .servHeadFlex > a
    {
        width: 100%;
        margin-left: 0px;
    }
}