html {
    /* Устанавливаем шрифт по умолчанию */
    --font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}


html,
body {
    margin: 0;
    padding: 0;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: fixed;
    font-family: var(--font-family);
    font-style: normal;
    font-weight: 500;
}

.context-menu {
    position: absolute;
    background-color: #2d2d2d;
    border: 1px solid #444;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    padding: 8px 0;
    z-index: 1000;
    display: none;
}

.context-menu-item {
    position: relative;
    padding: 8px 16px;
    cursor: pointer;
    color: #ffffff;
    font-size: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.context-menu-item:hover {
    background-color: #3a3a3a;
}

.context-menu-item.has-submenu::after {
    content: '►';
    margin-left: 8px;
    font-size: 12px;
    font-family: auto;

}

.submenu {
    position: absolute;
    top: 0;
    left: 100%;
    background-color: #2d2d2d;
    border: 1px solid #444;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    padding: 8px 0;
    display: none;
    min-width: 150px;
}

.context-menu-item:hover>.submenu {
    display: block;
}


.btn,
input,
.nav-link {
    font-family: var(--font-family);
    font-weight: 500;
}




html {
    color-scheme: light dark;
}


body {
    /* cursor: none; */
    cursor: url("cursor/cursor.webp"), auto;
    /* cursor: url(https://play.vsthemes.org/t-cursors/70655/6c24c665bde4efc5166fe06fc4394471.webp), auto; */
    background-color: rgb(66, 66, 66);
    /* display: flex; */
    flex-wrap: wrap;
    justify-content: center;
    background-image: url(background.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    overflow: hidden;
    /* padding: 0px 15px 0px 15px; */
    backdrop-filter: brightness(20%);
    /* backdrop-filter: blur(4px) brightness(30%); */
    /* width: 100%;
    height: 95%;
    position: absolute; */
}




/* .hand-drawn-border::before {
    content: '';
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    border: 4px solid #ffffff;
    border-radius: 10px;
    filter: url(#rough-edge);
    z-index: -1;
} */
#anime_franchise_iframe {
    height: 800px;
    border-radius: 9px;
}

#anime_related_list {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    /* padding-top: var(--bs-card-spacer-x); */
    /* padding-right: var(--bs-card-spacer-y); */
    /* padding-bottom: 2rem; */
    /* padding-left: var(--bs-card-spacer-x); */
    scroll-behavior: smooth;
}

.anime_related_spoiler,
.anime_franchise_spoiler {
    background-color: #c6c6c6;
    color: #424242;
    width: 100%;
    text-align: center;
    border-radius: 7px;
    margin: 15px 0px 15px 0px;
    padding: 5px 0px 5px 0px;
    font-size: 1.2rem;
    font-weight: 700;
    user-select: none;
}

#anime_related_title {
    padding-top: var(--bs-card-spacer-x);
    padding-right: var(--bs-card-spacer-y);
    /* padding-bottom: var(--bs-card-spacer-y); */
    padding-left: var(--bs-card-spacer-x);
}

.related_cart {
    flex-shrink: 0;
}

.related_cart .cart-img-top {
    height: calc(25rem/1.25);
    width: calc(17rem/1.25);
}

img.img_cover {
    background-size: inherit;
    position: absolute;
    aspect-ratio: 9 / 14;
    width: 100%;
    height: 100%;
    overflow: hidden;
}


/* Другая история */
.\%D0\%94\%D1\%80\%D1\%83\%D0\%B3\%D0\%B0\%D1\%8F\%20\%D0\%B8\%D1\%81\%D1\%82\%D0\%BE\%D1\%80\%D0\%B8\%D1\%8F {
    color: #ea4c89;
}

/* Развёрнутая история */
.\%D0\%A0\%D0\%B0\%D0\%B7\%D0\%B2\%D1\%91\%D1\%80\%D0\%BD\%D1\%83\%D1\%82\%D0\%B0\%D1\%8F\%20\%D0\%B8\%D1\%81\%D1\%82\%D0\%BE\%D1\%80\%D0\%B8\%D1\%8F {
    color: chartreuse;
}

/* Обобщение */
.\%D0\%9E\%D0\%B1\%D0\%BE\%D0\%B1\%D1\%89\%D0\%B5\%D0\%BD\%D0\%B8\%D0\%B5 {
    color: #673AB7;
}

/* Прочее */
.\%D0\%9F\%D1\%80\%D0\%BE\%D1\%87\%D0\%B5\%D0\%B5 {
    color: #000000;
}

/* Общий персонаж */
.\%D0\%9E\%D0\%B1\%D1\%89\%D0\%B8\%D0\%B9\%20\%D0\%BF\%D0\%B5\%D1\%80\%D1\%81\%D0\%BE\%D0\%BD\%D0\%B0\%D0\%B6 {
    color: antiquewhite;
}

/* Продолжение */
.\%D0\%9F\%D1\%80\%D0\%BE\%D0\%B4\%D0\%BE\%D0\%BB\%D0\%B6\%D0\%B5\%D0\%BD\%D0\%B8\%D0\%B5 {
    color: aqua;
}

/* Предыстория */
.\%D0\%9F\%D1\%80\%D0\%B5\%D0\%B4\%D1\%8B\%D1\%81\%D1\%82\%D0\%BE\%D1\%80\%D0\%B8\%D1\%8F {
    color: #FFEB3B;
}

.screen_filter {
    filter: brightness(20%);
    mask-image: radial-gradient(circle, white 50%, transparent 100%);
}

canvas#starryCanvas {
    position: fixed;
}

.container_ {
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Old versions of Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                    supported by Chrome, Edge, Opera and Firefox */
}

.card {
    background-color: transparent;
}

#dr_border {
    position: absolute;
    width: 0;
    height: 0;
}

:root {
    --color_R: hsl(0, 100%, 50%);
    /* Красный */
    --color_G: hsl(120, 100%, 50%);
    /* Зелёный */
    --color_B: hsl(240, 100%, 50%);
    /* Синий */
}

/*  Создание карточки для скрина */
.screen_transform {
    background-Color: #212529;
    width: 900px !important;
    height: auto !important;
    aspect-ratio: auto !important;
    background-image: url("waves.png");
    background-repeat: repeat;
    background-size: 7%;

}

.screen_transform #btn_sh_save,
.screen_transform #copy_discord,
.screen_transform #info_AnilibriaPlayer,
.screen_transform #info_AlohaPlayer,
.screen_transform #info_KodikPlayer,
.screen_transform #anime_related,
.screen_transform #anime_franchise {
    display: none !important;
}
/**********************************/


#new_anime_list {
    display: flex;
    background-color: #0d6efd54;
    /* border: #ff00e985; */
    border-width: 4px;
    border-style: inset;
    flex-wrap: wrap;
    justify-content: center;
    border-image: linear-gradient(45deg,
            var(--color_R),
            var(--color_G),
            var(--color_B),
            var(--color_R)) 1;
    animation: rotateColors 20s linear infinite;
}


@keyframes rotateColors {
    0% {
        border-image: linear-gradient(45deg,
                var(--color_R),
                var(--color_G),
                var(--color_B),
                var(--color_R)) 1;
    }

    33.33% {
        border-image: linear-gradient(45deg,
                var(--color_G),
                var(--color_B),
                var(--color_R),
                var(--color_G)) 1;
    }

    66.66% {
        border-image: linear-gradient(45deg,
                var(--color_B),
                var(--color_R),
                var(--color_G),
                var(--color_B)) 1;
    }

    100% {
        border-image: linear-gradient(45deg,
                var(--color_R),
                var(--color_G),
                var(--color_B),
                var(--color_R)) 1;
    }
}

#modal_reiting_info_userTable_body {
    max-height: 400px;
    /* Ограничиваем высоту таблицы */
    overflow-y: auto;
    /* Включаем вертикальную прокрутку */
}

#userTableBody th,
#userTableBody td {
    text-align: center;
    /* Горизонтальное центрирование */
    vertical-align: middle;
    /* Вертикальное центрирование */
}

#copy_discord {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
}

#User_inf_ava {
    border-radius: 50%;
    width: 150px;
    height: 150px;
    object-fit: cover;
}

.user-card {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 20px;
    border-radius: 8px;
}

.btn-discord {
    width: 38px;
    height: 38px;
    background-image: url(discord_logo.png);
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 4px;
    margin-right: 4px;
}
.btn-camera {
    width: 38px;
    height: 38px;
    background-image: url(camera.png);
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 4px;
    margin-right: 4px;
}

.btn-telegram {
    width: 38px;
    height: 38px;
    background-image: url(telegram_logo.png);
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 4px;
    margin-right: 4px;
}

#btn_vk_share {
    width: 38px;
    height: 38px;
    background-image: url(vk_share.png);
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 4px;
    margin-right: 4px;
}

#qrcode_main {
    flex-direction: column;
}

#qrcode_main div {
    width: 100%;
    aspect-ratio: 1 / 1;
    padding: 10px;
    background-color: #fefefe;
    border-radius: var(--bs-modal-inner-border-radius);
}


#qrcode_main div img {
    width: 100%;
    height: 100%;
}

.yellow:hover,
.yellow:focus,
.yellow:active,
.yellow.active,
.open>.dropdown-toggle.yellow {
    color: #000000;
    background-color: #ffdd00;
    border-color: #dec104;
}

.yellow_bg {
    background-color: #b49d03;
    color: #000000;
}

.pink:hover,
.pink:focus,
.pink:active,
.pink.active,
.open>.dropdown-toggle.pink {
    color: #ffffff;
    background-color: #ff00fb;
    border-color: #c201bf;
}

.pink_bg {
    background-color: #9f039d;
    border-color: #880386;
    color: #ffffff;
}



.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open>.dropdown-toggle.btn-success {
    color: #fff;
    background-color: #3b8a3f;
    /* Темно-зеленый цвет */
    border-color: #2d6a2e;
    /* Темно-зеленый цвет */
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active,
.open>.dropdown-toggle.btn-danger {
    color: #fff;
    background-color: #9a3838;
    /* Темно-красный цвет */
    border-color: #792525;
    /* Темно-красный цвет */
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.open>.dropdown-toggle.btn-warning {
    color: #fff;
    background-color: #ab7a2f;
    /* Темно-оранжевый цвет */
    border-color: #865b24;
    /* Темно-оранжевый цвет */
}


.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.open>.dropdown-toggle.btn-info {
    color: #000;
    background-color: #31d2f2;
    border-color: #25cff2;

}

#info_title2 {
    color: darkgrey;
}

#load {
    background-color: #0000008b;
    z-index: 999999999999999999;
    /* backdrop-filter: blur(2px); */
    display: flex;
    /* display: none; */
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: fixed;
}

.cartRaitingProgress {
    border-radius: 0;
}

#image-preview-window {
    pointer-events: none;
    position: absolute;
    display: none;
    border: 1px solid #ccc;
    background-color: #fff;
    padding: 5px;
    z-index: 999999999999999999;
}

.ned,
.ned_shikimori {
    display: flex;
    flex-wrap: wrap;
    border-radius: 15px;
    border-style: solid;
    border-width: 0.3rem;
    border-color: #c6c6c6;
    justify-content: center;
    background-color: #5d5d5db5;
    /* border: none; */
}

.ned_name {
    background-color: #c6c6c6;
    color: #424242;
    width: 100%;
    text-align: center;
    border-radius: 7px;
    margin: 15px 0px 15px 0px;
    padding: 5px 0px 5px 0px;
    font-size: 1.2rem;
    font-weight: 700;
    user-select: none;
}


.cart-fav {
    display: none;
    border-style: solid;
    border-width: 0.3rem 0rem 0.3rem 0.3rem;
    border-color: #ffffff00;
    visibility: hidden;
    position: absolute;
    right: 0;
    width: 3rem;
    /* height: 4rem; */
    top: 33%;
    background-color: #353434bd;
    padding: 0px 17px 0px 17px;
    border-radius: 25px 0px 0px 25px;
    padding: 4px 0px 4px 8px;
    z-index: 2;
    cursor: pointer;
}

.cart-fav:hover {
    border-color: #ffffff;
}

/* button.btn.btn-primary.mt-3 {
    width: 100%;
} */

#list_calendar,
#list_fav {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
}



.anime_list {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
}




@media (min-width: 989px) and (max-width: 1270px) {

    /* @media (max-width: 1270px) and (orientation: landscape) { */
    html {
        font-size: 0.7rem;
    }

    #navbarSupportedContent {
        font-size: 1rem;
    }
}

.container_ {
    width: 100%;
    height: calc(100% - 56px);
    overflow: auto;
    bottom: 0;
    position: fixed;
}

.hide {
    display: none !important;
}

.new_cart {
    border-color: #1008b6 !important;
}

.nd[open] {
    .ned_name {
        background-color: rgb(218, 239, 148);
    }
}

#closeDialogButton,
#VideoInfoBtn {
    background-color: #2b3035;
    border-color: #2b3035;
}

#closeDialogButton {
    position: fixed;
    right: 25px;
    top: 64px;
    width: 45px;
    height: 45px;
    z-index: 9999999999;
}

#closeDialogButton:hover,
#VideoInfoBtn:hover {
    background-color: #363d43;
    border-color: #363d43;

}

#pipDialogButton {
    padding: 0px;
    position: absolute;
    right: 6px;
    top: 55px;
    width: 45px;
    height: 45px;
}

#VideoPlayerAnime,
#VideoPlayerAnime>div,
#VideoPlayerAnime>div>div {
    overflow: hidden;
    padding: 0;
    /* width: 80%; */
    /* height: 80%; */
    border-radius: 12px;
    border-width: thin;
    border-color: #6d757d;
    aspect-ratio: 16 / 9;
    overflow-y: hidden;

}

dialog::backdrop {
    background-color: rgba(0, 0, 0, 0.5);
    /* backdrop-filter: blur(5px); */
}

.DialogVideoInfoScroll {
    left: 0% !important;
}

.DialogVideoInfoHiden {
    height: 0% !important;
}

#DialogVideoInfo {
    background-color: #212529;
    position: absolute;
    width: 200%;
    height: calc(100% - 50px);
    left: -100%;
    transition: left 1s ease, height 1s ease;
    bottom: 0;
    transition-behavior: allow-discrete;
}

.progress-bar .sr-only {
    font-size: 16px;
}


iframe#VideoPlayer {
    position: absolute;
    width: 50%;
    height: 100%;
    border: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    left: 50%;

}

.cart-del {
    position: fixed;
    right: 0;
    top: 0;
    transition: visibility 0s 0.15s;
    position: absolute;
    background-color: #353434bd;
    padding: 0px 15px 7px 18px;
    border-radius: 0px 0px 0px 20px;
    font-size: 2.2rem;
    z-index: 2;
    border-bottom: solid;
    border-left: solid;
}

.cart-del:hover {
    color: #aaaaaa
}

#search_form {
    width: 25%;
}

#VideoInfo {
    position: absolute;
    width: 50%;
    height: 100%;
    border: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    padding: 15px 0px 0px 15px;
    /* background-color: #212529; */
    aspect-ratio: 16 / 9;
    top: 0%;
    transition: top 1s ease;
    overflow-y: auto;
}

.VideoInfoBtn {
    writing-mode: vertical-rl;
    left: 50%;
    top: 40%;
    margin-left: -40px;
    position: absolute;
    z-index: 2;
    height: 20%;
    width: 80px;
}

/*Режим pip*/
@media screen and (min-width: 992px) {
    .ta_modal {
        width: 500px !important;
        height: 300px !important;
        top: calc(100% - 300px) !important;
        left: calc(100% - 500px) !important;
        right: 0px !important;
        bottom: 0px !important;
        position: fixed !important;

        #ta_modal_pip_btn_mini {
            stroke: none;
        }

        #VideoInfoBtn {
            display: none;
        }
    }
}

dialog::backdrop {
    background-color: rgba(0, 0, 0, 0.5);
}

.ta_modal-backdrop_hide {
    transition: opacity 1s;
    pointer-events: none;
    opacity: 0 !important;
}

p {
    margin: 0;
}

@media screen and (max-height: 900px) {
    #btn_so_max {
        display: none;

    }

    #VideoInfoBtn {
        height: 70px;
    }

}

@media screen and (orientation: landscape) {
    #VideoPlayerAnime>div {
        width: 80%;
        max-width: 80%;
        aspect-ratio: 16 / 9;

        height: 80%;
    }
}

@media screen and (orientation: portrait) {
    img.img_cover {
        position: absolute;
        aspect-ratio: 9 / 14;
        height: 100%;
        width: auto;
        overflow: hidden;
    }

    /* .cart-del {

    } */
    #anime_related_list {
        flex-direction: column;
    }

    #new_anime_list {
        flex-direction: column;
        width: 100%;
    }

    .anime_list {
        flex-direction: column;

    }

    .cart-raiting {
        z-index: 3 !important;
    }

    .cart-title,
    .cart-time,
    .cart-voice,
    .cart-series {
        padding: 6px 0px 0px 26px !important;
        left: 152px;
    }

    .cart-time {
        margin: 0;
        font-size: 0.7em !important;
        position: relative;
        right: 0px;
        bottom: 0px;
        /* background: #212529 !important; */
        background: transparent !important;
        text-align: left !important;
    }

    /* .cart-cal::before {
        content: ", ";
    } */

    .cart-cal {
        margin: 0;
        font-size: 1em !important;
        position: relative;
        padding: 6px 0px 0px 0px !important;
        /* left: 180px; */
        /* background: #212529 !important; */
        background: transparent !important;
        text-align: left !important;
        /* display: inline-block; */
    }

    .cart-img-top {
        background-color: #212529 !important;
        width: 100% !important;
        height: 14rem !important;
        background-position: left;
        display: flex;
        background-size: contain !important;
        background-repeat: no-repeat;
        flex-direction: column !important;
        align-items: stretch;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
    }


    .cart-voice {
        writing-mode: horizontal-tb !important;
        margin: 0;
        font-size: 0.7em !important;
        position: relative !important;
        right: 0px;
        /* background: #212529 !important; */
        background: transparent !important;
        text-align: left !important;
    }



    .cart-title {
        font-size: 1.1em !important;
        margin: 0;
        width: calc(90% - 180px);
        position: relative;
        /* background: #212529 !important; */
        background: transparent !important;
        /* overflow: hidden; */
        text-align: left !important;
    }

    .cart-series::after {
        content: " серия";
    }

    .cart-series {
        margin: 0;
        /* font-size: 15px; */
        font-size: 0.7em !important;
        position: relative !important;
        /* background: #212529 !important; */
        background: transparent !important;
        bottom: 0px !important;
        border-radius: 0 !important;
        flex-grow: 1;
        /* padding-left: 20px !important; */
    }

    /* .cart-raiting {
        width: 21px;
    } */
    .cart-raiting div div {
        overflow: visible !important;
        display: flex;
        justify-content: flex-end;

    }

    .cart-raiting div div span {
        font-size: 1.3em !important;
        overflow: inherit !important;
        text-align: left !important;
        width: 100% !important;
        left: 0 !important;
        margin-bottom: 6px;
    }


    .cart_:hover,
    .cart_:active,
    .cart_:focus {
        transform: rotateY(0) !important;

        .cart-img-top,
        .cart-time,
        .cart-title,
        .cart-fav,
        .cart-series {

            transform: rotateY(0) !important;
            visibility: visible !important;
            transition: visibility 0s 0.15s;
        }

        .cart-BG {
            display: none;
        }

    }

    .cart-BG {
        display: none;
    }


    .cart_ {
        /* cursor: url("cursor/pointer.webp"); */
        width: 99% !important;
        margin: 1px !important;
        border-radius: 0px !important;

        /* height: ; */
        .cart-title,
        .cart-fav {

            visibility: visible;
        }

    }


    .cart_n {
        height: 9rem !important;
        width: 100% !important;
        display: flex !important;
        align-content: center;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
    }

    .cart_n div {
        font-size: 1.5em !important;
        margin: 0px !important;
        border-radius: 0px !important;
        padding: 0 !important;
        width: 100% !important;
        height: 50% !important;
        display: inline-block;
    }

    .cart_n div div {
        /* font-size: 0.7em !important; */
        display: inline-block;
        width: auto !important;
        height: auto !important;
        border-radius: 30px !important;
        margin-bottom: 33px !important;
        background-color: #ff000000 !important;
        padding: 0px !important;
    }

    .ned {
        border: none;
        background: none;
    }

}

@media screen and (min-height: 900px) {
    #btn_so_min {
        display: none;
    }

}

@media screen and (max-height: 500px) {


    /* #btn_so_max {
        display: none;
        
    } */
    /* #VideoInfoBtn{
        height: 50px;
    } */

}

@media screen and (min-height: 500px) {
    /* #btn_so_min {
        display: none;
    } */


}

/* (max-width: 992px) and */
@media screen and (orientation: portrait),
screen and (max-width: 992px) {



    .related_cart {
        flex-shrink: 0;
    }



    #pipDialogButton {
        display: none;
    }

    /* .VideoInfoBtn {
        right: 60px;
        width: 60px;
    } */

    iframe#VideoPlayer {
        height: 100%;
    }

    #VideoPlayerAnime,
    #VideoPlayerAnime>div,
    #VideoPlayerAnime>div>div {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        height: auto;
        overflow: hidden;
        min-height: 100%;
        max-width: 100%;
        border: none;
        border-radius: 0;
    }

    .VideoInfoBtn {
        position: fixed;
        transition: left 1s ease;
        bottom: auto;
        left: 0;
    }

    .DialogVideoInfoScroll>.VideoInfoBtn {
        position: fixed;
        transition: left 1s ease;
        bottom: auto;
        left: 100%;
    }

    #search_form,
    #User_Menu_Group,
    #list_login_Button,
    #list_QRScan_Button {
        margin: 3px !important;
        width: 100%;

    }

    #User_Menu_Button {
        margin: 0px !important;
    }

    #VideoInfo {
        padding: 4px;
    }

    #info_cover {
        max-width: none !important;
        width: 90% !important;
    }

    #VideoInfo>div>div>div>div {
        width: 100%;
    }

    /* #carouselExampleAutoplaying, */
    /* #carouselExampleAutoplaying2 { */
    /* margin: 4px !important; */
    /* width: 50% !important; */
    /* height: 100%; */
    /* width: auto !important; */
    /* display: none; */
    /* } */

}

.minh-100 {
    min-height: 100%;
}

.minw-100 {
    min-width: 100%;
}

.df_im {
    /* display: flex !important; */
    margin: 0 auto;
}


#carouselExampleAutoplaying {
    width: 50%;
    position: absolute;
}

#info_cover {
    max-width: 350px;
    width: 60%;
}

.vi_label {
    background-color: #00000051 !important;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
}

.vi_label p {
    color: white !important;
}

@media screen and (max-width: 992px) {
    /*     .anime_list 
    {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: center;

    } */


}


@media screen and (min-width: 992px) {

    #VideoPlayerAnime {
        /* transition:  right, bottom 1s ease; */
        /* transition: width, height 1s ease; */
        transition: all 1s ease;
        width: 100%;
        height: 100%;
        right: 0px;
        bottom: 0px;
        left: 0px;
        top: 0px;
    }



    #VideoPlayerAnime>div>div {
        width: 100%;
        height: 100%;

    }
}

:root {
    --background-pos-x: 50%;
    --background-pos-y: 50%;
}

/* .paralax-bg{ */

/* background-size: 130% !important; */
/* background-position: var(--background-pos-x) var(--background-pos-y); */
/* }  */

.cart-img-top {
    background-size: 100% 100%;
    transition: transform 0.3s cubic-bezier(0.4, 0, 1, 1);
    /* background-size: cover; */
    height: 25rem;
    width: 17rem;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-between;
    aspect-ratio: 16 / 9;
    border-style: solid;
    border-width: 0.3rem;
    border-color: #2e2a29;
    background-repeat: no-repeat;
    transform-style: preserve-3d;
}

.cart-title {
    background: linear-gradient(180deg, rgb(69, 69, 69, 0.8) 0%, rgba(69, 69, 69, 0.8) 80%, rgba(191, 191, 191, 0) 100%);
    /*background-color: #5d5d5dde; */
    text-align: center;
    padding: 10px 0px 25px 0px;
    /* visibility: hidden; */
    z-index: 2;
    /* height: 125px; */
}

.cart-voice {
    position: absolute;
    top: 0;
    bottom: 0;
    position: fixed;
    writing-mode: vertical-rl;
    padding: 1px;
    text-align: center;
    margin: 0px;
    z-index: 1;
    /* background-color: #5d5d5d99; */
    background: linear-gradient(193deg, rgba(69, 69, 69, 0) 0%, rgba(69, 69, 69, 0.8) 25%, rgba(69, 69, 69, 0.8) 75%, rgba(69, 69, 69, 0) 100%);
}

.cart-raiting {
    top: 0;
    bottom: 0;
    position: absolute;
    right: 0;
}

.progress-bar-vertical {
    width: 26px;
    height: 100%;
    float: left;
    display: flex;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    background-color: #424242af;
}

.progress-bar-vertical .progress-bar {
    width: 100%;
    height: 0;
    /* -webkit-transition: height 0.6s ease;
    -o-transition: height 0.6s ease;
    transition: height 0.6s ease; */
    z-index: 2;
    max-height: 100%;
}

span.sr-only {
    writing-mode: vertical-rl;
}

#VoiceSettings_content {
    padding: 13px;
    /* max-height: 90vh; */
    /* flex-wrap: wrap; */
}

.cart-time {
    /* background-color: #5d5d5dde; */
    transition: transform 0s 0.15s;
    background: linear-gradient(0deg, rgb(69, 69, 69, 0.8) 0%, rgba(69, 69, 69, 0.8) 80%, rgba(191, 191, 191, 0) 100%);
    padding: 25px 0px 10px 0px;
    text-align: center;
    margin: 0px;
    padding: 5px;
    z-index: 2;

}

.cart-series {
    transition: visibility 0s 0.15s;
    position: absolute;
    right: 0px;
    background-color: #353434bd;
    padding: 0px 15px 7px 18px;
    border-radius: 0px 0px 0px 20px;
    font-size: 2.2rem;
    z-index: 2;
}

/* #info_title::before {
    content: '';
    width: .5em;
    height: .5em;
    border-radius: 1em;
    background-color: #20ff87;
    margin-right: .5em;
  } */



.cart_ {
    /* transition: transform 0.3s ease, border-color 0.1s 0.2s; */
    background-color: transparent !important;
    border-color: rgba(0, 0, 0, 0);
    /* border-color: rgb(255, 255, 255); */
    overflow: hidden;
    border-radius: 5px;
    border-style: solid;
    border-width: 0.3rem;
    margin: 2px;
    scale: 1;
    /* scale: 0;
    transition: scale 0.5s ease; */
    /* user-select: none; */
    /* opacity: 0%;
    transition: opacity 2s ease; */
    animation: fadeIn 1.5s forwards;
    opacity: 0;
    /* scale: 0; */
}

@keyframes fadeIn {
    to {
        /* scale: 1; */
        opacity: 1;
    }
}

.cart_n {
    height: 25rem;
    width: 17rem;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
}

.cart_n:hover {
    border-color: rgba(0, 0, 0, 0) !important;
}

.cart_n_bg {
    --bs-bg-opacity: 1;
    border-color: #212529;
    border-style: solid;
    border-width: 0.3rem;
    border-radius: 5px;
}

.cart_spawn {
    scale: 1;
    /* opacity: 100%; */
}

.cart-BG {
    visibility: hidden;
    transition: visibility 0s 0.15s;
    padding-left: 30px;
    padding-right: 37px;
    line-height: 1;
    text-shadow: 0px 4px 7px #000000;
    position: fixed;
    inset: 0;
    transform: rotateY(180deg);
    backdrop-filter: blur(5px) brightness(0.5);
    font-style: revert;
    font-weight: normal;
}

.cart_:hover,
.cart_:active,
.cart_:focus {
    .cart-title {
        visibility: hidden;
    }

    .cart-voice {
        writing-mode: vertical-lr;
    }

    .progress-bar>span {
        writing-mode: vertical-lr;
    }


    background-color: transparent !important;

    .cart-img-top {
        /* background-color: #16276378; */
        /* background-blend-mode: soft-light; */

        border-color: rgb(255, 255, 255) !important;
        transform: rotateY(180deg);
    }

    .cart-img-top::before {
        filter: blur(5px);
    }

    /* border-color: rgb(255, 255, 255) !important; */
    /* transform: scale(1.3); */
    z-index: 2;

    .cart-time,
    /* .cart-title, */
    .cart-BG,
    .cart-fav {
        transform: rotateY(180deg);
        visibility: visible;
        transition: visibility 0s 0.15s, transform 0s 0.15s;

    }

    .cart-series {
        transition: visibility 0s 0.15s;
        visibility: hidden;
    }

    border-style: solid !important;
}

@media (max-width: 600px) {
    .cart_ {
        /* border-color: rgb(255, 255, 255); */

        .cart-title,
        .cart-fav {
            visibility: visible;
        }
    }
}

#ToastsMain {
    right: 30px;
}



/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */


.AniLibria\.TV {
    color: rgb(250, 145, 145);
}

.Dream\%20Cast {
    color: rgb(136, 255, 255)
}

.AniStar {
    color: rgb(251, 73, 251);
}

.AnimeVost {
    color: rgb(101, 214, 101);
}

.AniDUB,
.AniDub\%20Online {
    color: rgb(214, 161, 101);
}

.SHIZAProject {
    color: rgb(118, 101, 214);
}

.JAM {
    color: rgb(214, 101, 101);
}

.\%D0\%A0\%D1\%83\%D0\%90\%D0\%BD\%D0\%B8\%D0\%BC\%D0\%B5\%20\%2F\%20DEEP,
.AniStar\%20\%26\%20DEEP {
    color: rgb(198, 116, 61);
}

.SHIZA\%20Project {
    color: rgb(101, 214, 180);
}

.\%D0\%94\%D1\%83\%D0\%B1\%D0\%BB\%D0\%B8\%D1\%80\%D0\%BE\%D0\%B2\%D0\%B0\%D0\%BD\%D0\%BD\%D1\%8B\%D0\%B9 {
    color: rgb(151, 255, 31);
}

.VF-Studio {
    color: rgb(243, 73, 73);
}


.container_1 {
    width: 100%;
    max-width: 500px;
    margin: 5px;
}

.container_1 h1 {
    color: #ffffff;
}

.section_1 {
    background-color: #202428;
    padding: 50px 30px;
    border: 1.5px solid #b2b2b2;
    border-radius: 8px;
    /* box-shadow: 0 20px 25px rgba(0, 0, 0, 0.25); */
}

#my-qr-reader__scan_region video {
    border-radius: 8px;
}

#my-qr-reader {
    padding: 20px !important;
    /* border: 1.5px solid #b2b2b2 !important; */
    border-radius: 8px;
    border: none !important;
}

#my-qr-reader img[alt="Info icon"] {
    display: none;
}

#my-qr-reader img[alt="Camera based scan"] {
    width: 100px !important;
    height: 100px !important;
}

#html5-qrcode-anchor-scan-type-change {
    text-decoration: none !important;
    color: #1d9bf0;
}


