body:lang(np),
body:lang(np) * {
    font-family: laila !important;
}

.background {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
}

.char-img-l-t{
    position: absolute;
    top: 2%;
    left: 5%;
    width: 9%;
    border: 4px solid #FFCF3E;
    border-radius: 50%;
    background: #ffffff;
}
.c-g{
    left: 4%;
}

.boy-h{
    left: 4%;
}

.inv-img{
    transform: rotateY(180deg);
}
/* speechbox starts */
.sp-1{ 
    top: 2%;
    left: 15%;
    width: 40%;
    height: 16%;
    padding: .5% 1% .5% 2.5%;
}
14
.box {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
}

.speechbox>p {
    position: relative;
    width: 95%;
    left: 50%;
    top: 50%;
    font-family: laila;
    color: #ffffff;
    transform: translate(-50%, -50%);
}

/* speechbox ends */


/* page contents start */
.p-abs{
    position: absolute;
}

.bag{
    left: 0%;
    bottom: 24%;
    width: 15%;
}
.bag-front{
    z-index: 1;
}
.copy{
    width: 10%;
    top: 61%;
    left: 16%;
    transform: rotate(-22deg);
}
.crayons{
    width: 4%;
    top: 58%;
    left: 27%;
}
.tape{
    width: 10%;
    top: 53%;
    left: 32%;
}
.glue{
    width: 13%;
    top: 49%;
    left: 41%;
}
.book{
    width: 11%;
    top: 63%;
    left: 34%;  
}
.clipboard{
    width: 7%;
    top: 59%;
    left: 51%;
}

/* geomterybox content styles */
.geometrybox{
    left: 3%;
    bottom: 22%;
    width: 21%;
}
.pencil{
    width: 10%;
    top: 61%;
    left: 24%;
}
.sharpener{
    width: 8%;
    top: 67%;
    left: 36%;
    transform: rotate(28deg);
    z-index: 1; 
}
.ruler{
    width: 19%;
    top: 51%;
    left: 34%;
    transform: rotate(-29deg);
}
.eraser{
    width: 8%;
    top: 66%;
    left: 49%;
}


.clickable{
    cursor: url('../images/clickme_icon.png'),auto;
}
.popup-img-container{
    top: 62%;
    left: 14.5%;
    height: 70%;
    width: 44%;
    border-radius: 15px;
    background-color: #ffffff;
    transform: translateY(-50%);
    border: 2px solid #3C78D8;
    display: none;
    z-index: 2;
}
.popup-img{
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
}
.cross{
    position: absolute;
    top: 2%;
    right: 2%;
    width: 10%;
}
.cross:hover{
    cursor: pointer;
}



/* page contents end */


















/* video player css */

.videoDiv {
    position: absolute;
    right: 3%;
    top: 5%;
    height: 90%;
    width: 30%;
    background: #FFF7C1;
    border-radius: 29px;
    overflow: hidden;
    box-shadow: -9px 9px 1px #fba522;
    border: 2px solid #FBA522;
}

.video_holder {
    position: absolute;
    bottom: 22%;
    left: 50%;
    transform: translateX(-50%);
    height: 75%;
    width: 75%;
}

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

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

.replaybtn_container {
    position: absolute;
    bottom: 0%;
    height: 22%;
    width: 70%;
    left: 50%;
    transform: translateX(-50%);
}

#replay_video_btn {
    width: 100%;
    pointer-events: none;
}

.vid {
    height: 87.5%;
    width: 100%;
}

.no_click{
    pointer-events: none;
}

@media (min-aspect-ratio:4/3) {
    .txt1 {
        font-size: 5vh;
    }
    .fs-4{
        font-size : 4vh;
    }
    .imgName,
    .lesMore
    {
        font-size: 4vh;
    }
    .vehicle-name {
        font-size: 5vh;
    }
}

@media (max-aspect-ratio:4/3) {
    .txt1 {
        font-size: 3vw;
    }
    .vehicle-name {
        font-size: 4vw;
    }
}