body:lang(np),
body:lang(np) * {
    font-family: laila !important;
}
.no-display{
    display: none;
}
.cover_page{
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    /* height: 100%; */
    object-fit: cover;
}
.background {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.background14{
    position: absolute;
    top: 0%;
    left: 44.5%;
    width: 45%;
    height: 100%;
    object-fit: cover;
}

.chaptertitle {    
    top: 8%;
    right: 54%;
    width: 28%;
    padding: 2% 1% 2% 1%;
    color: white;
    border-radius: 20px;
    background-color: #988bb9;
}
.page1{
    top: 5%;
    right: 6%;
    font-size: 5vh;
    width: 40%;
    padding: 1%;
    color: white;
    border-radius: 15px;
    background-color: #71534D;
}
.page-2{
    top: 4%;
    right: 44.5%;
    width: 50%;
    padding: 1%;
    color: white;
    border-radius: 15px;
    background-color: #8c80b0;
}
.page14{
    top: 1%;
    right: 13%;
    font-size: 4.5vh;
    width: 40%;
    padding: 1%;
    color: white;
    border-radius: 15px;
    background-color: #71534D
}
.cb_bg{
    background-color: #ffe9e3;
}
.mirrored{
    transform: rotateY(180deg);
}
.paint-block{
    position: absolute;
    top: 42%;
    left: 12%;
    width: 34%;
    height: 100%;
    z-index: 99;
}
.seeds,.seeds1{
    position: absolute;
    z-index: 1;
    width: 18%;
    left: 14%;
    top: 42%;
    border: 2px solid #8176a0;
    border-radius: 30px;
    background: white;
    padding: 1%;
    box-shadow: 4px 4px 20px 1px rgb(151 172 171 / 75%);
    -webkit-box-shadow: 4px 4px 20px 1px rgb(151 172 171 / 75%);
    -moz-box-shadow: 4px 4px 20px 1px rgba(151,172,171,0.75);
}
.seeds1{
    padding: 0%;
    width: 22%;
    height: 81%;
    top: 12%;
    left: 6%;
}
/* character styles */
.biru-conv{
    position: absolute;
    z-index: 1;
    width: 25%;
    left: 48%;
    top: 35%;
}
.muna-conv{
    position: absolute;
    z-index: 1;
    width: 27%;
    left: 12%;
    top: 38%;
}
.grand_parent{
    position: absolute;
    top: 35%;
    left: 26%;
    width: 32%;
    z-index: 9;
}
.numa_com01{
    position: absolute;
    top: 32%;
    left: 12%;
    width: 26%;
    z-index: 9;
}
.numa_com02{
    position: absolute;
    top: 40%;
    left: 12%;
    width: 16%;
    z-index: 9;
}
.numa_com03{
    position: absolute;
    top: 44%;
    left: 8%;
    width: 18%;
    z-index: 9;
}
.numa_com04,.numa_com06{
    position: absolute;
    top: 40%;
    left: 46%;
    width: 16%;
    z-index: 9;
}
.numa_com06{
    width: 14%;
    top: 38%;
    left: 48%;
}
/* speechbox styles */
.box {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
}
.bottom-text{
    position: relative;
    width: 60%;
    left: 56%;
    top: 46%;
    transform: translate(-50%, -50%);
}
.bottom-text1{
    position: relative;
    width: 62%;
    left: 67%;
    top: 46%;
    transform: translate(-50%, -50%);
}
.bottom-text2{
    position: relative;
    width: 62%;
    left: 56%;
    top: 46%;
    transform: translate(-50%, -50%);
}
.speechbox>p {
    position: relative;
    width: 100%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.sp-2{
    position: absolute;
    top: 3%;
    left: 10%;
    width: 26%;
    height: 26%;
    padding: 1% 1% 3.5% 1%;
}
.sp-3{
    position: absolute;
    top: 8%;
    left: 12%;
    width: 32%;
    height: 34%;
    padding: 2% 1.5% 6% 1.5%;
}
.sp-4{
    position: absolute;
    top: 10%;
    left: 37%;
    width: 26%;
    height: 28%;
    padding: 1% 2% 5% 2%;
}
.sp-5{
    position: absolute;
    top: 1%;
    left: 14%;
    width: 26%;
    height: 48%;
    padding: 2% 21% 4% 5%;
}
.sp-6{
    position: absolute;
    top: 4%;
    left: 32%;
    width: 30% !important;
    height: 34%;
    padding: 1% 1% 6% 1.5%;
}
.sp-7{
    position: absolute;
    top: 4%;
    left: 28%;
    width: 36%;
    height: 34%;
    padding: 1% 2% 6% 2.5%;
}

/* #region video player css */
.sidevideoDiv_coverpg{
    height: 100%;
    width: 35%;
    left: 0%;
}

div[class*="svd"]{
    height: 90%;
    width: 30%;   
}

.svd-l{
    left: 5%;
}

.svd-r{
    right: 5%;
}

.side_video_holder{
    position: absolute;
    top: 0%;
    left: 0%;
    height: 100%;
    width: 100%;
    background: #ffe6f1;
    border-radius: 45px;
    overflow: hidden;
    border: 2px solid #a194c3;
    box-shadow: 10px 10px 1px -2px #afa2d3;
    -webkit-box-shadow: 10px 10px 1px -2px #afa2d3;
     -moz-box-shadow: 10px 10px 1px -2px #6c89b8;
}

.videolabel-btm {
    position: absolute;
    bottom: 0%;
    width: 100%;
    background: #969a7d;
    padding: 5%;
}

#nslVideo {
    position: absolute;
    width: 40%;
    top: 0%;
    left: 50%;
    transform: translateX(-50%);
}

.video_container {
    position: absolute;
    height: 80%;
    width: 100%;
    bottom: 20%;
    display: flex;
    justify-content: space-around;
    align-items: flex-end;
    overflow: hidden;
}

.replaybtn_container {
    position: absolute;
    bottom: 0%;
    height: 20%;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    /* background-color: #62654C; */
}

#replay_video_btn {
    width: 70%;
    margin: auto;
    pointer-events: none;
}
.vid {
    height: 85%;
    width: 100%;
}

/* #endregion */


/* #region common */
.txt1{
    z-index: 99;
}
    .p-abs{
        position: absolute;
    }

    .c-x{
        left: 50%;
        transform: translateX(-50%);
    }

    .c-y{
        top: 50%;
        transform: translateY(-50%);
    }
    .c-xy{
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
/* #endregion */


/* #region media queries */

@media (min-aspect-ratio:4/3) {
    .txt1, .txt3, .number_show{
        font-size: 4vh;
    }
    .cld-txt-1, .cld-txt-2 {
        font-size: 3.2vh;
    }
    .sickness-txt {
        font-size: 4vh;
    }
    .chaptertitle{
        font-size: 8vh;
    }
    .page-2{
        font-size: 5vh;
    }
}

@media (max-aspect-ratio:4/3) {
    .txt1, .txt3, .number_show {
        font-size: 2.4vw;
    }
    .cld-txt-1, .cld-txt-2  {
        font-size: 2.2vw;
    }
    .sickness-txt {
        font-size: 2.8vw;
    }
    .chaptertitle{
        font-size: 4.5vw;
    }
}

/* #endregion media queries */