@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Poppins", sans-serif;
}
html{
}
body{
    background: #fff;
}
body::-webkit-scrollbar{
    background-color: var(--secondary-color);
    width: 0px;
}
body::-webkit-scrollbar-thumb{
    background-color: var(--primary-color);
}

:root{
    --primary-font: "Poppins", sans-serif;
    --secondary-font: "Mulish", sans-serif;
    --third-font: "Libre Baskerville", serif;
    --primary-color: #1f1a6b;
    --secondary-color: #faa532;
    --txt-color: #2c2c2c;
}
/* ============== global css start here =================== */
a{text-decoration: none;color: #000; display: block;}
ul{padding: 0; margin: 0; list-style-type: none;}
p,h1,h2,h3,h4,h5,h6{margin: 0;}
.mob-footeroverlay{display: none;}
#preloader{
    width: 100%;
    height: 100vh;
    background: #fff;
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}
.preloader-content{
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.preloader-content .loader{
    display: flex;
    align-items: center;
    justify-content: center;
}
.preloader-content .loader span{
    width: 60px;
    height: 60px;
    display: block;
    border: 3px solid rgb(207 0 86 / 20%);
    border-radius: 50px;
    border-top: 2px solid var(--secondary-color);
    animation: loader 3s linear infinite;
}
@keyframes loader{
    0%{transform: rotate(0deg);}
    100%{transform: rotate(360deg);}
}
.preloader-content h3{
    font-weight: 800;
    letter-spacing: 2px;
    font-size: 1.3em;
    color: var(--primary-color);
}
.preloader-content h3 i{}
.pagebreadcrumb{
    background: #f5f4f0;
    padding: 0 40px;
    background: #1f1a6b14;
    background: url('../images/bredcrumb.webp');
    background-size: cover;
    background-repeat: no-repeat;
}
.pagebreadcrumb:after{
}
.pagebreadcrumb .breadcrumb-col{padding: 30px 0;display: flex;align-items: center;justify-content: center;flex-direction: column;}
.pagebreadcrumb .breadcrumb-col h3{
    color: #000;
    font-weight: 400;
    /* font-family: var(--third-font); */
    letter-spacing: 1px;
    text-transform: uppercase;
    margin: 0 0 5px;
    font-size: 1.3em;
}
.pagebreadcrumb .breadcrumb-col ul{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.pagebreadcrumb .breadcrumb-col ul li{
    color: var(--secondary-color);
    font-weight: 500;
    font-size: 14px;
    display: flex;
}
.pagebreadcrumb .breadcrumb-col ul li a{
    color: #000000;
    font-size: 12px;
    font-weight: 400;
}
.pagebreadcrumb .breadcrumb-col ul li:not(:first-child):before{
    content: "/";
    margin: 0 5px;
    color: #000;
    font-size: 13px;
}

.pagebreadcrumb .breadcrumb-col ul li:not(:last-child) a{
    color: var(--primary-color);
    font-weight: 600;
}

.pagetitle{
    padding: 10px;
    background-color: #f4f4f4;
    border-radius: 5px;
    margin: 0 0 20px;
}
.pagetitle h3{
    font-size: 1.4em;
    font-weight: 700;
    text-transform: capitalize;
    font-family: var(--secondary-font);
}
.pagetitle .subtitle{    
    font-weight: 700;
    font-size: .9em;
    text-transform: capitalize;
    color: var(--primary-color);
}

.msgbox{
    position: fixed;
    bottom: 0;
    z-index: 9999;
    width: 100%;
}
.msgbox .loading-wrapper{
    background: #87c1f3;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}
.msgbox .loading-wrapper .loading_span{
    width: 20px;
    height: 20px;
    display: block;
    border: 2px solid var(--primary-color);
    border-right: 2px solid transparent;
    border-radius: 50%;
    animation: loading 1s linear alternate infinite;
}
@keyframes loading{
    0%{transform: rotate(0deg);}
    100%{transform: rotate(360deg);}
}
.msgbox .loading-wrapper p{
    color: #fff;
    font-size: 14px;
}
.msgbox .alertdiv{
    background: #fff;
    padding: 12px  10px;
    text-align: center;
}
.msgbox .alertdiv.success{
    background: green;
}
.msgbox .alertdiv.failed{
    background: red;
}
.msgbox .alertdiv p{color: #fff; margin: 0; font-size: 16px; letter-spacing: 1px;}
.msgbox .alertdiv.success p{}
.msgbox .alertdiv.failed p{}
    .pagebreadcrumb{
    background: #f5f4f0;
    padding: 0 40px;
    background: #1f1a6b14;
    background: url('../images/bredcrumb.webp');
    background-size: cover;
    background-repeat: no-repeat;
    background: #3f51b51f;
}
/* ============== global css end here =================== */

/*===================
    header
===================*/
header{
    padding: 0 40px;
    transition: .3s linear;
    background: #fff;
    position: relative;
    z-index: 99;
    box-shadow: 0px 15px 10px -15px #9999994f;
}
header.fix{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
    background: #fff;
    box-shadow: 0 1px 5px 2px #0000000f;
}
.header-left{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: start;
}
.websitelogo{
    transform: translateY(-8px);
}
.websitelogo img{
    width: 130%;
}
.header-center{}
.header-center .menu-ul{
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 1.1em;
    margin-right: 0%;
}
.header-center .menu-li{
    position: relative;
}
.header-center .menu-li.mob-li{display: none;}
.header-center .menu-li.moblogo-li{
    display: none;
}
.header-center .menu-a{
    padding: 40px 0;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    position: relative;
    text-transform: uppercase;
}
.header-center .menu-a:before{
    content: "";
    width: 100%;
    height: 1px;
    background: #b7e2f9;
    position: absolute;
    bottom: 25px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: .3s linear;
}
.header-center .menu-a.active:before,
.header-center .menu-a:hover:before{
    transform: scale(1);
}


.submenu_list{
    position: absolute;
    top: 120%;
    left: 0;
    width: 250px;
    background: #ffffff;
    z-index: 99;
    transition: .3s linear;
    padding: 5px 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    border-radius: 5px;
    box-shadow: 0 5px 15px 0 #0000003b;
}
.header-center .menu-li:hover .submenu_list{
    top: 100%;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.submenu_list .mob_sub_li{
    position: relative;
}
.submenu_list .mob_sub_li .sub_link{
    font-size: 0.9em;
    color: var(--txt-color);
    font-weight: 400;
    letter-spacing: 0.3px;
    transition: .2s linear;
    padding: 8px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.submenu_list .mob_sub_li .sub_link:hover{
    color: #000;
    font-weight: 500;
}
.childmenu_list{
    position: absolute;
    left: 100%;
    width: 300px;
    background: #fff;
    top: 105%;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: .3s linear;
    border-radius: 5px;
    box-shadow: 0 5px 15px 0 #0000003b;
}
.submenu_list .mob_sub_li:hover .childmenu_list{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    top: 0;
}
.childmenu_list .mob_child_li{}
.childmenu_list .mob_child_li .child_link{
    font-size: 0.9em;
    color: var(--txt-color);
    font-weight: 400;
    letter-spacing: 0.3px;
    transition: .3s linear;
    padding: 8px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.childmenu_list .mob_child_li .child_link:hover{
    color: #000;
    font-weight: 500;
}


.header-right{
    display: flex;
    align-items: center;
    justify-content: end;
    height: 100%;
}
.header-right .searchpanelicon{margin-right: 20px;}
.header-right .loginbtn{
    font-size: 0.9em;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    letter-spacing: .5px;
    transition: .2s linear;
    position: relative;
    z-index: 1;
    color: #000;
    font-weight: 500;
    text-transform: uppercase;
    background: #00a6ff;
    color: #fff;
    padding: 8px 20px;
    border-radius: 3px;
    background: linear-gradient(45deg, #342e92, #00a6ff);
}
.header-right .loginbtn:before{
    display: none;
}
.header-right .loginbtn:hover{
    background: linear-gradient(45deg, #00a6ff, #342e92);
}
.header-right .mobmenushow{
    display: none;
}

/*===================
    widget one
===================*/
.widget-one{
    position: relative;
    z-index: 1;
}
/*.widget-one:before{
    content: "";
    width: 100%;
    height: 100%;
    background: #00000040;
    position: absolute;
    top: 0;
    left: 0;
}*/
.widget-one .sliderimg{
    background: #fff;
    /* height: 84vh; */
}
.widget-one .sliderimg .sliderbox{
    width: 90%;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 50px 0 0;
}
.widget-one .sliderimg .leftslider{
    width: 60%;
}
.widget-one .sliderimg .leftslider h3{
    font-size: 30px;
    font-weight: 600;
    margin: 0 0 10px;
    color: var(--primary-color);
}
.widget-one .sliderimg .leftslider h3 span{
    display: block;
    color: #0088d0;
    font-weight: 300;
}
.widget-one .sliderimg .leftslider p{
    font-size: 18px;
}
.widget-one .sliderimg .leftslider a{
    display: inline-block;
    padding: 10px 20px;
    border-radius: 3px;
    color: #fff;
    margin: 15px 0 0;
    transition: .3s linear;
    font-size: 16px;
    letter-spacing: 1px;
    text-transform: uppercase;
    box-shadow: 2px 2px 10px 0 rgba(0,0,0,0.3);
    background: linear-gradient(45deg, #342e92, #00a6ff);
    transition: .3s linear;
}
.widget-one .sliderimg .leftslider a:hover{
    background: linear-gradient(45deg, #00a6ff, #342e92);
}
.widget-one .sliderimg .rightslider{
    width: 40%;
    text-align: center;
}
.widget-one .sliderimg .rightslider img{width: 70%;margin: auto;}
.widget-one .sliderimg img{width: 100%;}
.slider .slick-dots{
    bottom: 30px;
}
.slider .slick-dots li{margin: 0 5px;width: 8px;height: 8px;background: var(--primary-color);opacity: 0.8;}
.slider .slick-dots li.slick-active{background: var(--secondary-color);width: 20px;height: 10px;}
.slider .slick-dots li button{
    display: none;
}
.slick-dotted.slick-slider{margin-bottom: 0;}
.searchpanel{
    position: fixed;
    top: 17%;
    right: 9%;
    background: var(--primary-color);
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: .3s linear;
    padding: 20px 15px;
    border-radius: 5px;
}
.searchpanel.active{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.searchpanel .searchpanelclose{
    position: absolute;
    top: 1px;
    right: 6px;
    font-size: 0.8em;
    color: #fff;
    transition: .3s linear;
}
.searchpanel .searchpanelclose:hover{
    color: var(--secondary-color);
}
.search-gridbox{
}
.search-gridbox .gridbox-title{
    font-family: var(--third-font);
    font-size: 2.5em;
    font-weight: 800;
    text-align: center;
    color: var(--primary-color);
}
.search-gridbox .gridbox-title .centertag{
    font-family: var(--third-font);
    color: var(--secondary-color);
}
.gridbox-form{
}
.grid-fields{
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.grid-fields .fields{
}
.grid-fields .fields.fields-one{
}
.grid-fields .fields.fields-two{}
.grid-fields .fields.fields-three{border: none;}
.grid-fields .fields :is(select, input){
    width: 100%;
    display: block;
    padding: 5px 10px;
    border: none;
    outline: none;
    background: none;
    /* color: #fff; */
    font-size: .9em;
    background: #ffffff;
}
.grid-fields .fields select{
}
.grid-fields .fields input{}
.grid-fields .fields button{
    border: none;
    outline: none;
    font-size: 1em;
    background: no-repeat;
    background: #b6e1f8;
    width: 100%;
    border-radius: 1px;
    padding: 5px 10px;
    font-weight: 500;
    text-transform: uppercase;
    color: #000000;
    transition: .3s linear;
}
.grid-fields .fields button:hover{
    background: var(--secondary-color);
}
.grid-fields .fields button:before{}

/*===================
    widget two
===================*/
.widget-two{
    padding: 0 40px 50px;
}
.books-gridtwo{
    position: relative;
    height: 500px;
}
.books-gridtwo{}
.books-gridtwo.left{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}
.books-gridtwo .gridimg-first{
    display: flex;
    flex-direction: column;
    gap: 50px;
}
.books-gridtwo .gridimg-first:nth-child(1){
    margin: 8em 0 0;
}
.books-gridtwo .gridimg-first:nth-child(2){}
.books-gridtwo .gridimg-first .gridimg1{width: 80%;}
.books-gridtwo .gridimg-first .gridimg1 img{width: 100%;}
.books-gridtwo .gridimg{
    position: absolute;
    top: 30px;
    width: 200px;
    transition: .2s linear;
}
.books-gridtwo .gridimg:hover{
    transform: translateY(-10px);
}
.books-gridtwo .gridimg img{
    width: 100%;
}
.books-gridtwo .gridimg:nth-child(1){
    left: 20px;
    width: 200px;
}
.books-gridtwo .gridimg:nth-child(2){left: 50%;transform: translateX(-50%);z-index: 5;width: 250px;top: 0;}
.books-gridtwo .gridimg:nth-child(2):hover{
    transform: translate(-50%, -10px);
}
.books-gridtwo .gridimg:nth-child(3){
    right: 20px;
    width: 200px;
}

.books-gridtwo.right{
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}
.books-gridtwo .gridimg-second{
    display: flex;
    flex-direction: column;
    gap: 50px;
}
.books-gridtwo .gridimg-second:nth-child(1){
}
.books-gridtwo .gridimg-second:nth-child(2){
    margin: 8em 0 0;
}
.books-gridtwo .gridimg-second .gridimg1{width: 80%;}
.books-gridtwo .gridimg-second .gridimg1 img{width: 100%;}
.books-gridtwo .gridimg1{
    transition: .2s linear;
}
.books-gridtwo .gridimg1:hover{
    transform: translateY(-10px);
}

/*===================
    widget three
===================*/
.widget-three{
    padding: 4% 0 10%;
    background: #fff;
    /*    border-bottom: 1px solid #ddd;*/
}
.widget-three.threeagain{
    background: url("../images/bgbanner.webp");
    background-size: cover;
    position: relative;
    z-index: 1;
    padding: 8% 0;
}
.widget-three.threeagain:before{
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, #050041, #0d075ae0, #0d075ae0, #050041);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.widget-three .head{}
.widget-three .head h3{
    text-align: center;
    font-size: 2.2em;
    font-weight: 400;
    color: var(--primary-color);
    margin-bottom: 16px;
    width: 45%;
    margin: 0 auto 16px;
    line-height: 1;
    font-size: 1.8em;
}
.widget-three .head p{
    text-align: center;
    padding: 0 4%;
    margin-bottom: 37px;
    color: var(--txt-color);
}
.widget-three.threeagain .head{}
.widget-three.threeagain .head h3{
    color: #fff;
    text-align: center;
    font-weight: 700;
    font-size: 2.6em;
    width: 70%;
    margin: 0 auto 16px;
}
.widget-three.threeagain .head p{
    text-align: center;
    padding: 0 16%;
    color: #fff;
    margin-bottom: 0;
}
.widget-three .gridthree-img{
    text-align: center;
    border-radius: 0;
    margin: 15px;
    box-shadow: 0px 15px 10px -15px #9999994f;
    position: relative;
    z-index: 1;
}
.widget-three .gridthree-img .icon{
    padding: 20px 0 200px;
}
.widget-three .gridthree-img .icon img{width: 85px;}
.widget-three .gridthree-img .icon i{font-size: 3.5em;color: #fff;}
.widget-three .gridthree-img .content{
    position: absolute;
    top: 100px;
    left: 20px;
    background: #ffff;
    box-shadow: 0 0 34px 0 rgba(0, 0, 0, 0.15);
    padding: 50px 20px;
    width: 100%;
}
.widget-three-row .flexbox:nth-child(1) .gridthree-img .icon{background: #feb000;}
.widget-three-row .flexbox:nth-child(2) .gridthree-img .icon{background: #4CAF50;}
.widget-three-row .flexbox:nth-child(3) .gridthree-img .icon{background: #2a99ff;}
.widget-three-row .flexbox:nth-child(4) .gridthree-img .icon{background: var(--primary-color);}
.widget-three .gridthree-img h4{
    font-size: 18px;
    color: #000000;
    font-weight: 600;
    width: 100%;
    padding: 0 0 10px;
}
.widget-three .gridthree-img p{font-size: 14px;color: #786f6f;color: #9f9f9f;font-weight: 400;color: #000;}

/*===================
    widget four
===================*/
.widget-four{
    background: #fff;
    padding: 50px 40px;
    background: #eee;
    background: url('../images/catbg.webp');
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    position: relative;
    z-index: 1;
}
.widget-four:before{
    content: "";
    background: #404040bd;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    backdrop-filter: blur(2px);
}
.widget-four .maintitle{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 40px;
}
.widget-four .maintitle .heading{
    text-align: center;
}
.widget-four .maintitle .heading .tagline{
    letter-spacing: 3px;
    font-size: .9em;
    font-weight: 600;
    color: #03acee;
}
.widget-four .maintitle .heading .title{
    font-weight: 400;
    color: var(--primary-color);
    margin: 0 0 15px;
    font-size: 1.8em;
    color: #fff;
}
.widget-four .maintitle .heading p{
    width: 90%;
    margin: auto;
    color: #eee;
}
.widget-four .maintitle .viewbtn{
    color: var(--primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: .9em;
    gap: 5px;
    transition: .2s linear;
    letter-spacing: 2px;
    position: relative;
}
.widget-four .maintitle .viewbtn:after{
    content: "\f135";
    font-family: "bootstrap-icons";
    font-size: 1.7em;
    line-height: 1;
    display: block;
}
.widget-four .maintitle .viewbtn:before{
    content: "";
    width: 100%;
    height: 1px;
    background: var(--primary-color);
    position: absolute;
    bottom: 2px;
    left: 0;
    opacity: 0;
    transition: .3s linear;
}
.widget-four .maintitle .viewbtn:hover:before{
    opacity: 1;
}
.widget-four .bookcat{
    background: #fff;
    padding: 15px;
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin: 0 0 20px;
    transition: .2s linear;
    display: flex;
}
.widget-four .bookcat:hover{
    box-shadow: 0 10px 20px -15px #00000054;
}
.widget-four .bookcat .icons{
    width: 50%;
    margin: 0;
}
.widget-four .bookcat .icons img{
    width: 100%;
}
.widget-four .bookcat .heading{
    position: absolute;
    width: 50%;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    padding: 0 30px;
}
.widget-four .bookcat .heading img{
    width: 100px;
    margin: 0 0 20px;
}
.widget-four .bookcat .heading h3{
    font-size: 1.6em;
    color: var(--primary-color);
    margin: 0 0 5px;
}
.widget-four .bookcat .heading p{
    line-height: 1.4;
    font-size: 16px;
    letter-spacing: 0.5px;
    font-weight: 300;
}
.widget-four .bookcat .heading .countbooks{
    font-size: .9em;
    color: var(--txt-color);
}


/*===================
    widget five
===================*/
.widget-five{
    padding: 50px 0;
    background: var(--primary-color);
}
.widget-five .maintitle{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 30px;
}
.widget-five .maintitle .heading{}
.widget-five .maintitle .heading .tagline{
    letter-spacing: 3px;
    font-size: .9em;
    font-weight: 500;
    color: #b7e2f9;
}
.widget-five .maintitle .heading .title{
    font-weight: 400;
    color: var(--primary-color);
    color: #fff;
}
.widget-five .maintitle .viewbtn{
    display: inline-block;
    padding: 10px 20px;
    border-radius: 3px;
    color: #fff;
    margin: 15px 0 0;
    transition: .3s linear;
    font-size: 16px;
    letter-spacing: 1px;
    text-transform: uppercase;
    box-shadow: 2px 2px 10px 0 rgba(0,0,0,0.3);
    background: linear-gradient(45deg, #342e92, #00a6ff);
    transition: .3s linear;
}
.widget-five .maintitle .viewbtn:hover{
    background: linear-gradient(45deg, #00a6ff, #342e92);
}
.widget-five .maintitle .viewbtn:after{
    content: "\f135";
    font-family: "bootstrap-icons";
    font-size: 1.7em;
    line-height: 1;
    display: block;
    display: none;
}
.widget-five .maintitle .viewbtn:before{
    content: "";
    width: 100%;
    height: 1px;
    background: var(--primary-color);
    position: absolute;
    bottom: 2px;
    left: 0;
    opacity: 0;
    transition: .3s linear;
    display: none;
}
.widget-five .maintitle .viewbtn:hover:before{
    opacity: 1;
}
.widget-five .gridfive-box{
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin: 0 15px;
    transition: .2s linear;
    padding: 0 0 15px;
    background: #fff;
    padding: 15px;
}
.widget-five .gridfive-box:hover{
    box-shadow: 0 5px 20px -5px #030038;
    transform: scale(1.05);
}

.widget-five .gridfive-box figure{
}
.widget-five .gridfive-box figure img{
    width: 100%;
    border-radius: 10px;
}
.widget-five .gridfive-box .heading{
    text-align: center;
}
.widget-five .gridfive-box .heading h3{
    font-size: 1.1em;
    font-weight: 500;
    color: #000;
}
.widget-five .gridfive-box .heading span{
    font-size: .9em;
    color: var(--primary-color);
    font-weight: 500;
}
.widget-five .slick-track{margin: 20px 0;}
.widget-five .slick-arrow.slick-prev,
.widget-five .slick-arrow.slick-next{
    background: aliceblue;
    width: 40px;
    height: 40px;
    padding: 5px;
    border-radius: 50%;
    transition: .2s linear;
}
.widget-five .slick-arrow.slick-prev{
    left: -28px;
    z-index: 9;
}
.widget-five .slick-arrow.slick-next{
    left: 98%;
}

.widget-five .slick-arrow.slick-prev:before,
.widget-five .slick-arrow.slick-next:before{
    font-family: "simple-line-icons";
    font-size: 16px;
    color: #000;
    font-weight: 800;
}

.widget-five .slick-arrow.slick-prev:before{
    content: "\e605";
}
.widget-five .slick-arrow.slick-next:before{
    content: "\e606";
}
.widget-five .slick-arrow.slick-prev:hover,
.widget-five .slick-arrow.slick-next:hover{
    background: var(--secondary-color);
}
.widget-five .slick-arrow.slick-prev:hover:before,
.widget-five .slick-arrow.slick-next:hover:before{
    color: #fff;
}



/*===================
    widget six
===================*/
.widget-six{
    padding: 50px 40px;
    background: #DBD7C9;
    position: relative;
    z-index: 1;
    background: #ffffffc2;
}
.widget-six:before{
    /* content: "\ec51"; */
    font-size: 36em;
    font-family: remixicon;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
    color: #faa53226;
    color: #7dc6ec40;
}
.widget-six .maintitle{
    margin: 0 0 10px;
    text-align: center;
}
.widget-six .maintitle .tagline{
    letter-spacing: 3px;
    font-size: 0.8em;
    font-weight: 500;
    color: #000;
    display: block;
}
.widget-six .maintitle .title{font-weight: 400;color: var(--primary-color);font-size: 1.8em;}
.widget-six .gridsix-box{
    padding: 30px 20px;
    /* border-radius: 100px; */
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 10px 20px;
    width: 70%;
    margin: 20px auto;
    background: #faa5320a;
}
.widget-six .gridsix-box .icon{
    border-radius: 50%;
    background: #b7b7b71c;
    width: 150px;
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.8em;
    outline: 1px solid #b7b7b747;
    outline-offset: 5px;
    margin: 0 auto;
    border: 2px solid #B7B7B71C;
}
.widget-six .gridsix-box .icon i{
    color: var(--secondary-color);
}
.widget-six .gridsix-box .icon img{width: 100px;}
.widget-six .gridsix-box .content{
    display: inline;
    flex: 0 0 70%;
}
.widget-six .gridsix-box .content p{
    font-size: 1.1em;
    color: var(--txt-color);
    position: relative;
}
.widget-six .gridsix-box .content p:before{
    content: "\ec51";
    font-family: "remixicon";
    color: #ff0000;
    margin: 0 5px 0 0;
    font-size: 20px;
}
.widget-six .gridsix-box .content p:after{
    content: "\ec52";
    font-family: "remixicon";
    color: #0000ff;
    margin: 0 0 0 5px;
    font-size: 20px;
}
.widget-six .gridsix-box .leftbox{
    flex: 0 0 20%;
    text-align: center;
}
.widget-six .gridsix-box .leftbox .review-info{
    padding: 20px 0 0;
}
.widget-six .gridsix-box .leftbox .review-info h3{
    font-size: 1em;
    font-weight: 500;
    color: var(--primary-color);
}
.widget-six .gridsix-box .leftbox .review-info span{
    color: #a5a5a5;
    font-size: 0.7em;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 500;
}

.widget-six .slick-dots{
    bottom: -10px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.widget-six .slick-dots li{width: 6px;height: 6px;background: var(--primary-color);}
.widget-six .slick-dots li.slick-active{background: var(--secondary-color);width: 10px;height: 10px;}
.widget-six .slick-dots li button{display: none;}



/*===================
    widget seven
===================*/
.widget-seven{
    /* background: #E7E6E0; */
    padding: 50px 40px;
    background: #faa5320d;
}
.widget-seven .maintitle{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0 30px;
}
.widget-seven .maintitle .heading{}
.widget-seven .maintitle .heading .tagline{
    letter-spacing: 3px;
    font-size: 0.8em;
    font-weight: 500;
    color: #000;
}
.widget-seven .maintitle .heading .title{
    font-weight: 400;
    color: var(--primary-color);
    font-size: 1.8em;
}
.widget-seven .viewallblogs{text-align: center; margin: 30px 0 0;}
.widget-seven .viewallblogs .viewbtn{
    font-size: 0.9em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: .5px;
    transition: .2s linear;
    position: relative;
    z-index: 1;
    color: #000;
    font-weight: 500;
    text-transform: uppercase;
    background: #00a6ff;
    color: #fff;
    padding: 8px 20px;
    border-radius: 3px;
    background: linear-gradient(45deg, #342e92, #00a6ff);}

.widget-seven .viewallblogs .viewbtn:hover{
    background: linear-gradient(45deg, #00a6ff, #342e92);
}
.widget-seven .gridseven-box{
    background: #ffffff;
    transition: .2s linear;
    border: 1px solid #0000000a;
    border-radius: 5px;
    overflow: hidden;
    padding: 20px;
}
.widget-seven .gridseven-box:hover{
    box-shadow: 0 10px 20px -15px #00000054;
}
.widget-seven .gridseven-box .gridimg{
    overflow: hidden;
    border-radius: 10px;
}
.widget-seven .gridseven-box .gridimg img{width: 100%;transition: .2s linear;}
.widget-seven .gridseven-box .gridimg:hover img{
    transform: scale(1.05);
}
.widget-seven .gridseven-box .content{
    padding: 20px;
    text-align: center;
}
.widget-seven .gridseven-box .content .date{
    color: var(--primary-color);
    letter-spacing: 4px;
    font-size: .9em;
    display: block;
    padding: 0 0 10px;
}
.widget-seven .gridseven-box .content .title{
    font-size: 1.2em;
    line-height: 1.3;
    font-weight: 400;
    transition: .2s linear;
}
.widget-seven .gridseven-box .content .title:hover{
    color: var(--secondary-color);
}
/*===================
    widget eight
===================*/

footer{
    padding: 50px 40px 20px;
    border-top: 1px solid #ddd;
    background: #222;
}
footer .gridfooter-box{}
footer .gridfooter-box .footerlogo{
    margin: 0 0 20px;
}
footer .gridfooter-box .footerlogo img{width: 80%;}
footer .gridfooter-box p{
    font-size: 14px;
    color: #c9c9c9;
    font-weight: 300;
}
footer .gridfooter-box .listed{}
footer .gridfooter-box .listed .list{
    padding: 0 0 10px;
}
footer .gridfooter-box .listed .list .link{
    font-size: 14px;
    color: #c9c9c9;
    transition: .2s linear;
}
footer .gridfooter-box .listed .list .link:hover{
    color: var(--secondary-color);
    text-decoration: underline;
    text-underline-offset: 4px;
}

footer .gridfooter-box .contactinfo-ul{}
footer .gridfooter-box .contactinfo-ul .contactinfo-li{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px 0 0;
    margin: 0 0 20px;
}
footer .gridfooter-box .contactinfo-ul .contactinfo-li span{}
footer .gridfooter-box .contactinfo-ul .contactinfo-li span i{font-size: 1.2em;color: var(--secondary-color);}
footer .gridfooter-box .contactinfo-ul .contactinfo-li .contactinfo-a{
    font-size: 14px;
    color: #c9c9c9;
}
footer .gridfooter-box .contactinfo-ul .contactinfo-li .contactinfo-a:hover{
    color: var(--secondary-color);
}
footer .gridfooter-box .social-links{
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 20px 0 0;
}
footer .gridfooter-box .social-links a{
    font-size: 0.8em;
    color: #c9c9c9;
    transition: .2s linear;
}
footer .gridfooter-box .social-links a:hover{
    color: var(--secondary-color);
    transform: scale(1.5);
}
footer .gridfooter-box iframe{
    width: 100%;
    height: 210px;
}
footer .copyright{padding: 50px 0 0;}
footer .copyright p{
    color: #c9c9c9;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    gap: 5px;
}
footer .copyright p a{
    color: var(--secondary-color);
}
footer .copyright p a:hover{}





/*===================
widget books page
===================*/
.widget-books{
    background: #eee;
    padding: 30px 0;
    height: 100%
}
.widget-books .widget-books-row{
    position: relative;
}
.widget-books .widget-books-col{}
.widget-books .books-column{}
.widget-books .books-column .class-tab{
    background: #fff;
    padding: 5px 20px;
    margin: 0 0 20px;
    display: flex;
    align-items: center;
    display: none;
}
.widget-books .books-column .class-tab span{
    border: none;
    color: #333;
    text-transform: uppercase;
    padding: 0;
    white-space: nowrap;
    margin-right: 15px;
}
.widget-books .books-column .class-tab span img{
    width: 30px; margin-right: 5px;
}
.widget-books .books-column .class-tab ul{
    overflow: auto;
    display: flex;
    padding: 10px 0;
}
.widget-books .books-column .class-tab ul::-webkit-scrollbar{height: 3px;}
.widget-books .books-column .class-tab ul::-webkit-scrollbar-thumb{background: #ddd;}
.widget-books .books-column .class-tab ul li{
    display: inline-block;
    margin-right: 10px;
}
.widget-books .books-column .class-tab ul li a{
    font-size: 16px;
    font-weight: 500;
    border: 1px solid #ddd;
    padding: 4px 15px;
    border-radius: 50px;
    color: #bbb;
    transition: .3s linear;
}
.widget-books .books-column .class-tab ul li a:hover{
    background: #eee;
    color: #000;
}
.widget-books .books-wrapper{
    margin: 0 0 15px;
    padding: 0 0 5px;
    border-bottom: 1px solid var(--secondary-color);
    position: relative;
}
.widget-books .books-wrapper img{
    width: 100%;
}
.widget-books .books-wrapper h2{
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translateX(-50%);
    color: #ffff;
    font-size: 2.5em;
    font-weight: 200;
}
.widget-books .books-wrapper h3{
    font-size: 1.3em;
    text-transform: uppercase;
    font-weight: 600;
    margin: 30px 0 0;
    color: var(--primary-color);
}
.widget-books .gridbook-box{
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin: 0 0 20px;
    transition: .2s linear;
    background: #fff;
    padding: 10px 10px 20px;
    border-radius: 5px;
    box-shadow: 0 5px 10px -10px #00000061;
}
.widget-books .gridbook-box:before{
    content: "View";
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, #91c1db, #2886b7);
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 500;
    color: #fff;
    transition: .2s linear;
    opacity: 0;
    visibility: hidden;
    pointer-events: auto;
    display: none;
}
.widget-books .gridbook-box:hover{
    box-shadow: 0 10px 20px -6px #00000054;
}
.widget-books .gridbook-box:hover:before{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.widget-books .gridbook-box figure{
    position: relative;
    z-index: 1;
    text-align: center;
    margin: 0;
}
.widget-books .gridbook-box figure:before{
    content: "";
    width: 70%;
    height: 110%;
    background: #72ceff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
    display: none;
}
.widget-books .gridbook-box figure img{
    width: 100px;
}
.widget-books .gridbook-box .heading{
    padding: 10px 0 0;
    text-align: center;
}
.widget-books .gridbook-box .heading h3{
    font-size: 23px;
    font-weight: 600;
    transition: .3s linear;
    color: var(--primary-color);
    margin: 0 0 10px;
    margin: 0;
}
.widget-books .gridbook-box .heading p{
    width: 100%;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-align: center;
    margin: 0 0 15px;
}
.widget-books .gridbook-box .heading .viewbtn{
    font-weight: 500;
    font-size: 14px;
    transition: .3s linear;
}
.widget-books .gridbook-box .heading .viewbtn:hover{
    color: red;
}
.widget-books .gridbook-box .heading a:hover{
        color: var(--secondary-color);
}
.widget-books .gridbook-box .heading a{
    text-transform: uppercase;
    font-size: 12px;
    color: #a1a1a1;
    font-weight: 500;
}
.widget-books .gridbook-box .heading .tagnavkar{
    font-size: 12px;
    color: #333;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-weight: 500;
    position: relative;
    margin: 0 0 10px;
    display: inline-block;
}
.widget-books .gridbook-box .heading .tagnavkar:before{
    content: "";
    width: 100px;
    height: 1px;
    background: #bbb;
    position: absolute;
    bottom: -5px     ;
    left: 50%;
    transform: translateX(-50%);
}
.widget-books-left{
    background: #eee;
    position: sticky;
    top: 0;
    background: #fff;
    border-radius: 5px;
    height: 100%;
    border-bottom: 2px solid #ddd;
    background: linear-gradient(45deg, #2f2d68, #9b9cdc, #bebbf4);
    background: #006280;
    position: relative;
    z-index: 1;
}
.widget-books-left .books-filter{
    margin: 0;
    border-radius: 5px;
    padding: 10px 20px 0;
}
.widget-books-left .books-filter h3{
    border-radius: 3px;
    font-size: 1.1em;
    font-weight: 500;
    color: #3F51B5;
    padding: 12px 15px;
    background: #ffffff;
    box-shadow: -2px 11px 13px -15px #000;
    letter-spacing: 1px;
    margin: 10px auto;
    display: block;
    text-align: center;
}
.widget-books-left .books-filter .filter-box{
}
.widget-books-left .books-filter .filter-box .filter-list{}
.widget-books-left .books-filter .filter-box .filter-list .filter-link{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 15px;
    font-weight: 500;
    color: #fff;
    transition: .3s linear;
    font-size: 15px;
    text-transform: uppercase;
    border-bottom: 1px solid #3f51b524;
}
.widget-books-left .books-filter .filter-box .filter-list .filter-link.active,
.widget-books-left .books-filter .filter-box .filter-list .filter-link:hover{
    background: #ffffff40;
    /* color: var(--secondary-color); */
}
.widget-books-left .books-filter .filter-box .filter-list .filter-link i{}
.widget-books-left .books-filter .filter-box .filter-list .subfilter-box{padding: 5px 20px;/* background: #322d7e; */display: none;}
.widget-books-left .books-filter .filter-box .filter-list .subfilter-box .subfilter-list{}
.widget-books-left .books-filter .filter-box .filter-list .subfilter-box .subfilter-list .subfilter-link{
    padding: 4px 0;
    color: #fff;
    font-size: 14px;
    transition: .2s linear;
    font-weight: 400;
}
.widget-books-left .books-filter .filter-box .filter-list .subfilter-box .subfilter-list .subfilter-link.active,
.widget-books-left .books-filter .filter-box .filter-list .subfilter-box .subfilter-list .subfilter-link:hover{
    color: tomato;
}
.widget-books-left .books-filter .filter-box .filter-list .subfilter-box .subfilter-list .subfilter-link i{color: tomato;}
.widget-books .gridbook-box-book{
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin: 0 0 20px;
    transition: .2s linear;
    background: #fff;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0 5px 10px -10px #00000061;
}
.widget-books .gridbook-box-book:before{
    content: "View";
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, #91c1db, #2886b7);
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 500;
    color: #fff;
    transition: .2s linear;
    opacity: 0;
    visibility: hidden;
    pointer-events: auto;
    display: none;
}
.widget-books .gridbook-box-book:hover{
    box-shadow: 0 10px 20px -6px #00000054;
}
.widget-books .gridbook-box-book:hover:before{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.widget-books .gridbook-box-cat{
    display: flex;
    width: 100%;
}

.widget-books .gridbook-box-book figure{
    position: relative;
    z-index: 1;
    margin: 0;
}
.widget-books .gridbook-box-book figure img{
    width: 100%;
}
.widget-books .gridbook-box-cat figure img{
    width: 100%;
}
.norecords{}
.norecords p{font-weight: 500; font-size: 20px;}
.widget-books .gridbook-box-book .heading{
    padding: 10px 0 0;
    text-align: center;
}
.widget-books .gridbook-box-book .heading h3{
    font-size: 17px;
    font-weight: 600;
    transition: .3s linear;
    color: var(--primary-color);
    margin: 0 0 10px;
}
.widget-books .gridbook-box-book .heading .tagnavkar{
    font-size: 12px;
    color: #333;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-weight: 500;
    position: relative;
    margin: 0 0 10px;
    display: inline-block;
}
.widget-books .gridbook-box-book .heading .tagnavkar:before{
    content: "";
    width: 100px;
    height: 1px;
    background: #bbb;
    position: absolute;
    bottom: -5px     ;
    left: 50%;
    transform: translateX(-50%);
}
.widget-books .gridbook-box-cat .icons{
    width: 30%;
}
.widget-books .gridbook-box-cat .heading{
    width: 70%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 30px;
}
/*===================
widget download
===================*/
.widget-download{
    padding: 30px 0;
    background: #f1f1f1;
}
.widget-download .gridbook-box{
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin: 0 0 20px;
    transition: .2s linear;
    border-radius: 5px;
    box-shadow: 0 5px 10px -10px #00000061;
    background: #ffff;
    padding: 30px 20px;
}
.widget-download .gridbook-box:hover{
    box-shadow: 0 10px 20px -15px #00000054;
}
.widget-download .gridbook-box figure{margin: 0;position: absolute;top: 50%;right: 0;transform: translateY(-50%);}
.widget-download .gridbook-box figure img{
    width: 100px;
    opacity: 0.1;
    transition: .3s linear;
}
.widget-download .gridbook-box:hover figure img{
    opacity: 0.3;
}
.widget-download .gridbook-box .heading{}
.widget-download .gridbook-box .heading h3{
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 25px;
    color: var(--primary-color);
}

.widget-download .gridbook-box .heading a{
    text-transform: uppercase;
    font-size: 14px;
    color: #000;
    font-weight: 500;
    display: inline-block;
    border: 1px solid #cfcfcf;
    padding: 5px 10px;
    border-radius: 5px;
    margin-right: 5px;
    letter-spacing: 0.5px;
    transition: .3s linear;
}
.widget-download .gridbook-box .heading a:hover{
    background: #000;
    color: #fff;
    background: linear-gradient(45deg, #342e92, #00a6ff);
}

/*===================
widget book category page
===================*/
.widget-book-category{
    background: #fff;
    padding: 50px 40px;
}
.widget-book-category .bookcat{
    background: #1f1a6b0d;
    padding: 15px;
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin: 0 0 20px;
}
.widget-book-category .bookcat figure{
}
.widget-book-category .bookcat figure img{
    width: 100%;
}
.widget-book-category .bookcat .heading{}
.widget-book-category .bookcat .heading h3{
    font-size: 1.2em;
    font-weight: 500;
}
.widget-book-category .bookcat .heading .countbooks{
    font-size: .9em;
    color: var(--txt-color);
}


/*===================
widget books page
===================*/
.widget-websupport{
    background: #eee;
    padding: 30px 0;
}
.widget-websupport .widget-books-row{
    position: relative;
}
.widget-websupport .widget-books-col{}
.widget-websupport .websupport-column{
    background: #fff;
    padding: 20px;
}
.widget-websupport .websupport-wrapper{
    margin: 0 0 15px;
    position: relative;
    z-index: 1;
}
.widget-websupport .websupport-wrapper img{
    width: 100%;
}
.widget-websupport .websupport-wrapper:before{
    content: "";
}
.widget-websupport .websupport-wrapper h3{
    font-size: 1.3em;
    text-transform: uppercase;
    font-weight: 600;
    margin: 10px 0 0;
    color: var(--primary-color);
}
.widget-websupport .support-first{
    text-align: center;
    margin: 0 auto 20px;
    /* background: #fff; */
    padding: 40px;
    border-radius: 5px;
}
.widget-websupport .support-first h3{
    font-size: 1.8em;
    color: var(--primary-color);
    font-weight: 400;
}
.widget-websupport .support-first h4{
    font-weight: 600;
    color: var(--secondary-color);
    font-size: 1em;
    margin: 10px 0 10px;
}
.widget-websupport .support-first p{
    font-size: 15px;
    margin: 0 0 20px;
}
.widget-websupport .support-first a{display: inline-block;font-size: 0.9em;letter-spacing: .5px;transition: .2s linear;position: relative;z-index: 1;font-weight: 500;text-transform: uppercase;color: #fff;padding: 8px 20px;border-radius: 3px;background: linear-gradient(45deg, #342e92, #00a6ff);}
.widget-websupport .support-first a:hover{
    background: linear-gradient(45deg, #00a6ff, #342e92);
}
.widget-websupport .support-second{
    margin: 0 0 20px;
}
.widget-websupport .support-second h3{
    font-size: 1.8em;
    color: #000;
    margin: 0 0 5px;
    border-bottom: 1px solid #ddd;
    padding: 0 0 5px;
    font-weight: 400;
}
.widget-websupport .support-second p{
    font-size: 15px;
    line-height: 1.3;
}

.widget-websupport .gridbook-box{
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin: 0 0 20px;
    transition: .3s linear;
    background: #eee;
    padding: 60px 40px;
    border-radius: 5px;
    box-shadow: 0 5px 10px -10px #00000061;
}
.widget-websupport .gridbook-box:hover{
    box-shadow: 0 10px 20px -6px #00000054;
    background: #fff;
}
.widget-websupport .gridbook-box figure{margin: 0;}
.widget-websupport .gridbook-box figure img{
    width: 100%;
}
.widget-websupport .gridbook-box .heading{padding: 15px 0 5px;}
.widget-websupport .gridbook-box .heading h3{
    font-size: 1.2em;
    font-weight: 400;
    transition: .3s linear;
    color: var(--primary-color);
}
.widget-websupport .gridbook-box .heading a:hover{
        color: #7dc6ec
}
.widget-websupport .gridbook-box .heading a{
    text-transform: uppercase;
    font-size: 13px;
    color: #1f1a6b;
    font-weight: 600;
}
.widget-websupport .gridbook-box .heading span{
    font-size: 12px;
    color: #aaa;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-weight: 500;
}


/*===================
 widget login page
===================*/
.widget-login{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 50px 0;
}
.widget-login .loginbox{
    padding: 30px 30px 40px;
    width: 400px;
    background: #fff;
}
.widget-login .loginbox h3{
    font-weight: 500;
    margin: 0 0 10px;
    color: var(--primary-color);
    font-size: 1.3em;
    text-align: center;
}
.widget-login .loginbox h4{
    text-align: center;
}
.widget-login .loginbox p{
    text-align: center;
    font-size: 14px;
    color: #bbb;
    font-weight: 300;
}
.widget-login .loginbox .loginform{margin: 30px 0 0;}
.widget-login .loginbox .loginform form{}
.widget-login .loginbox .loginform form .fields{
    padding: 0 0 10px;
}
.widget-login .loginbox .loginform form .fields label{
    width: 100%;
    font-weight: 400;
    letter-spacing: 1px;
    font-size: .9em;
}
.widget-login .loginbox .loginform form .fields .inputgroup{
    position: relative;
}
.widget-login .loginbox .loginform form .fields .inputgroup .bi{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    z-index: 9;
    color: #ccc;
}
.widget-login .loginbox .loginform form .fields .inputgroup .bi.bi-eye{
    color: #000;
}
.widget-login .loginbox .loginform form .fields input{
    width: 100%;
    padding: 10px 15px;
    outline: none;
    border: 1px solid #ddd;
    border-radius: 5px;
}
.widget-login .loginbox .loginform form .fields-btn{
    margin: 15px 0 0;
}
.widget-login .loginbox .loginform form .fields-btn button{
    text-align: center;font-size: 17px;transition: .2s linear;position: relative;z-index: 1;outline: none;font-weight: 500;text-transform: uppercase;border: none;color: #fff;padding: 8px 20px;border-radius: 3px;background: linear-gradient(45deg, #342e92, #00a6ff);width: 100%;letter-spacing: 2px;}
.widget-login .loginbox .loginform form .fields-btn button:hover{
    background: linear-gradient(45deg, #00a6ff, #342e92);
}


/*===================
 widget book read page
===================*/
.widget-bookcode{
    padding: 50px 40px;
    background: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    transition: .3s linear;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.widget-bookcode.active{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.widget-bookcode .bookcodepanelclose{
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 25px;
    transition: .2s linear;
}
.widget-bookcode .bookcodepanelclose:hover{
    color: var(--primary-color);
}
.widget-bookcode .widget-bookcodeinner{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.widget-bookcode .gridbook-box{}

.widget-bookcode .gridbook-box figure{
    margin: 0;
    display: none;
}
.widget-bookcode .gridbook-box figure img{
    width: 100%;
}
.widget-bookcode .gridbook-code .heading{
    text-align: center;
}
.widget-bookcode .gridbook-code .heading h3{
    font-size: 1.8em;
    font-weight: 500;
    color: #000;
}
.widget-bookcode .gridbook-code .heading span{
    font-size: 16px;
    text-transform: uppercase;
    color: #000;
    letter-spacing: 3px;
}
.widget-bookcode .gridbook-code{
    display: flex;
    align-content: center;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
    background: #66339914;
    padding: 50px;
    width: 500px;
}
.widget-bookcode .gridbook-code .bookicon{text-align: center;}
.widget-bookcode .gridbook-code .bookicon img{width: 100px;}
.widget-bookcode .gridbook-code .enterbookcode{}
.widget-bookcode .gridbook-code .enterbookcode form{}
.widget-bookcode .gridbook-code .enterbookcode form .fields{
    text-align: center;
}
.widget-bookcode .gridbook-code .enterbookcode form .fields label{display: flex;font-size: .9em;font-weight: 500;letter-spacing: 0.5px;align-items: center;justify-content: center;color: var(--primary-color);}
.widget-bookcode .gridbook-code .enterbookcode form .fields label i{
    color: var(--primary-color);
    font-size: 1.7em;
    line-height: 1;
}
.widget-bookcode .gridbook-code .enterbookcode form .fields input{
    border: 1px solid #ddd;
    padding: 10px 15px;
    outline: none;
    width: 100%;
}
.widget-bookcode .gridbook-code .enterbookcode form .fields input:focus{
    border-color: #bbb;
}
.widget-bookcode .gridbook-code .enterbookcode form .fields input[type='submit']{font-size: 1em; text-align: center; letter-spacing: 2px;transition: .2s linear;position: relative;z-index: 1;font-weight: 500;text-transform: uppercase;color: #fff;padding: 10px 20px;border-radius: 3px;background: linear-gradient(45deg, #342e92, #00a6ff);margin: 10px 0 0;}

.widget-bookcode .gridbook-code .enterbookcode form .fields input[type='submit']:hover{
    background: linear-gradient(45deg, #00a6ff, #342e92);
}
.widget-bookcode .gridbook-code .enterbookcode small{
    color: red;
    text-align: center;
    display: block;
    font-size: 13px;
    font-weight: 500;
}

/*===================
 widget class page
===================*/
.widget-papergenerator{
    padding: 50px 40px;
    background: #eee;
}
.widget-papergenerator .gridbox-class-img{
    position: relative;
    z-index: 1;
}
.widget-papergenerator .gridbox-class-img:before{
    content: "";
    width: 90%;
    height: 90%;
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: #e9e9e8;
    z-index: -1;
    transition: .2s linear;
    background: var(--secondary-color);
    border-radius: 0 10px 10px 0;
}
.widget-papergenerator .gridbox-class-img img{width: 90%;border-radius: 30px 0 0 30px;}
.widget-papergenerator .gridclass-box{
    background: #faa5321a;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 15px;
    padding: 20px 20px;
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin: 0 0 20px;
}
.widget-papergenerator .class-title{
    margin: 0 0 20px;
}
.widget-papergenerator .class-title h3{
    font-size: 20px;
    font-weight: 600;
    color: var(--primary-color);
}
.widget-papergenerator .class-title h3 span{
    font-size: 12px;
    display: block;
    color: #aaa;
    text-transform: uppercase;
    line-height: 1;
}
.widget-papergenerator .gridclass-box-book{
    text-align: center;
    background: #fff;
    padding: 30px 20px;
    margin: 0 0 20px;
    box-shadow: 0 2px 10px -10px #000;
    transition: .2s linear;
}
.widget-papergenerator .gridclass-box-book:hover{
    transform: translateY(-10px);
    box-shadow: 0 4px 20px -15px #000;
}
.widget-papergenerator .gridclass-box-book .icons{
}
.widget-papergenerator .gridclass-box-book .icons img{
    width: 70px;
}
.widget-papergenerator .gridclass-box-book .heading{}
.widget-papergenerator .gridclass-box-book .heading h3{
    font-weight: 300;
    font-size: 1.4em;
}
.widget-papergenerator .gridclass-box:before{
    content: "";
    width: 100px;
    height: 100px;
    position: absolute;
    bottom: -50px;
    right: 40px;
    border-radius: 50px;
    background: #faa5321f;
    z-index: -1;
    transition: .2s linear;
}
.widget-papergenerator .gridclass-box:hover:before{
    background: #1f1a6b1f;
    transform: scale(1.5);
}
.widget-papergenerator .gridclass-box figure{
    width: 50px;
    height: 50px;
    margin: 0;
    border: 1px solid var(--secondary-color);
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .2s linear;
}
.widget-papergenerator .gridclass-box:hover figure{
    border-color: #000;
}
.widget-papergenerator .gridclass-box figure i{
    font-size: 1.2em;
    color: var(--primary-color);
    line-height: 1;
}
.widget-papergenerator .gridclass-box .heading{}
.widget-papergenerator .gridclass-box .heading h3{
    font-size: 1.4em;
    font-family: var(--third-font);
    font-weight: 600;
    color: var(--primary-color);
}
.widget-papergenerator .gridclass-box .heading .countbooks{
    font-size: .9em;
    color: var(--txt-color);
}

.widget-papergenerator .createpaper-form{
    padding: 20px;
    border-radius: 5px;
    background: #faa53217;
}
.widget-papergenerator .createpaper-form .papergenerator-title{
    margin: 0 0 20px;
}
.widget-papergenerator .createpaper-form .papergenerator-title h3{
    font-size: 20px;
}
.widget-papergenerator .createpaper-form .papergenerator-title h3 span{
    color: var(--primary-color);
}
.widget-papergenerator .createpaper-form .papergenerator-title h3 span:nth-child(1){
}
.widget-papergenerator .createpaper-form .papergenerator-title h3 span:nth-child(2){
}
.widget-papergenerator .createpaper-form form{}
.widget-papergenerator .createpaper-form form .fields{
    padding: 0 0 15px;
}
.widget-papergenerator .createpaper-form form .fields label{}
.widget-papergenerator .createpaper-form form .fields :is(select, input){
    border: 1px solid #1f1a6b40;
    transition: .2s linear;
    font-weight: 400;
    letter-spacing: .5px;
    padding: 8px 15px;
    background: #ffffff;
    border-radius: 0;
}
.widget-papergenerator .createpaper-form form .fields :is(select, input):focus{
    box-shadow: none;
    border-color: var(--secondary-color);
}
.widget-papergenerator .createpaper-form form .fields :is(select, input)::placeholder{
    font-weight: 500;
    color: rgb(55 55 55 / 30%);    
}



.questions-fields{
    padding: 20px 20px 0;
    background: #ffffff;
    height: 550px;
}
.questions-fields .title{}
.questions-fields .title h3{
    font-size: 1.1em;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--primary-color);
    letter-spacing: .5px;
}
.questions-fields .title h3 i{
    font-size: 1.5em;
}
.questions-fields .question-paper{
}
.questions-fields .question-paper .questions-box{
    padding: 0 0 20px;
}
.questions-fields .question-paper .questions-box p{
    font-weight: 600;
}
.questions-fields .question-paper .questions-box p i{
    color: var(--secondary-color);
    font-size: .9em;
}
.questions-fields .question-paper .questions-box .queslist li{
    letter-spacing: 0.5px;
    cursor: pointer;
    font-size: 15px;
}


.printpaper-fields{
    padding: 40px 20px 0;
    background: #ffffff;
    height: 550px;
}
.printpaper-fields .paperheader{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #000;
    padding: 0 0 10px;
    margin: 0 0 20px;
}
.printpaper-fields .paperheader .headerbox{
    display: flex;
    align-items: start;
    justify-content: center;
}
.printpaper-fields .paperheader .headerbox label{

font-weight: 600;

font-size: .9em;
}
.printpaper-fields .paperheader .headerbox span{
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: .9em;
}
.printpaper-fields .paperheader .headerbox span input{
    border: none;
    outline: none;
    width: 30px;
    text-align: center;
    font-weight: 600;
    border: 1px solid #eee;
    margin: 0 5px;
}
.printpaper-fields .paperheader .headerbox span input::-webkit-inner-spin-button,
.printpaper-fields .paperheader .headerbox span input::-webkit-outer-spin-button{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}
.printpaper-fields .paperheader .headerbox span p{
    color: #878787;
}

.printpaper-fields .question-paper{
}
.printpaper-fields .question-paper .questions-box{
    padding: 0 0 20px;
}
.printpaper-fields .question-paper .questions-box .questions-box-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.printpaper-fields .question-paper .questions-box .questions-box-head p{
    font-weight: 600;
}
.printpaper-fields .question-paper .questions-box .questions-box-head span{
    display: flex;
    align-items: center;
}
.printpaper-fields .question-paper .questions-box .questions-box-head span label{
    font-weight: 600;
}
.printpaper-fields .question-paper .questions-box .questions-box-head span input{
    width: 40px; 
    border: 1px solid #ddd;
    margin: 0 5px;
    outline: none;
    text-align: center;
}
.printpaper-fields .question-paper .questions-box .questions-box-head span input::-webkit-inner-spin-button,
.printpaper-fields .question-paper .questions-box .questions-box-head span input::-webkit-outer-spin-button{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}
.printpaper-fields .question-paper .questions-box p i{
    color: var(--secondary-color);
    font-size: .9em;
}
.printpaper-fields .question-paper .questions-box .queslist li{
    letter-spacing: 0.5px;
    position: relative;
    font-size: 15px;
}
.printpaper-fields .question-paper .questions-box .queslist li .actionbtns{
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}
.printpaper-fields .question-paper .questions-box .queslist li .actionbtns .bi{
    font-size: 0.9em;
}
.printpaper-fields .question-paper .questions-box .queslist li .actionbtns .bi.bi-pencil-square{
    color: green;
}
.printpaper-fields .question-paper .questions-box .queslist li .actionbtns .bi.bi-trash{
    color: red;
}

.widget-papergenerator .createpaper-form .fields-btn{
    padding: 30px 0 0;
    text-align: end;
}
.widget-papergenerator .createpaper-form .fields-btn button{
    border: none;
    outline: none;
    background: var(--primary-color);
    font-size: 1em;
    font-weight: 600;
    color: #fff;
    letter-spacing: 1px;
    padding: 7px 15px;
    border-radius: 3px;
    text-transform: uppercase;
    transition: .3s linear;
}
.widget-papergenerator .createpaper-form .fields-btn button.print{}
.widget-papergenerator .createpaper-form .fields-btn button.save{}
.widget-papergenerator .createpaper-form .fields-btn button:hover{
    background: var(--secondary-color);
}


/*===================
 widget contact
===================*/
.widget-contact{
    padding: 50px;
    background: #eee;
}
.widget-contact .contact-left{}
.widget-contact .contact-left .tagline{
    font-weight: 500;
    letter-spacing: 3px;
    color: var(--secondary-color);
}
.widget-contact .contact-left .title{font-family: var(--third-font);font-weight: 600;padding: 15px 0;font-size: 2.3em;}
.widget-contact .contact-left .address{
    padding: 20px 0;
}
.widget-contact .contact-left .address h4{
    color: var(--primary-color);
    font-family: var(--third-font);
    font-weight: 500;
    letter-spacing: 1px;
}
.widget-contact .contact-left .address p{
    font-weight: 400;
    font-size: 1.1em;
}
.widget-contact .contact-left .email-number{}
.widget-contact .contact-left .email-number a{
    font-size: 1.1em;
}
.widget-contact .contact-left .email-number a.phone{
    font-size: 1.9em;
    font-weight: 600;
}
.widget-contact .contact-left .email-number a.email{}
.widget-contact .contact-right{
    padding: 60px 0;
    background: #fff;
}
.widget-contact .contact-right form{
    width: 80%;
    margin: auto;
}
.widget-contact .contact-right form .fields{
    padding: 0 0 30px;
}
.widget-contact .contact-right form .fields label{}
.widget-contact .contact-right form .fields input{
    width: 100%;
    padding: 10px;
    border: 1px solid #eee;
    outline: none;
}
.widget-contact .contact-right form .fields textarea{
    width: 100%;
    border: 1px solid #eee;
    padding: 5px 10px;
    outline: none;
    
}
.widget-contact .contact-right form .fields input:focus,
.widget-contact .contact-right form .fields textarea:focus{
    border-color: var(--secondary-color);
}
.widget-contact .contact-right form .fields input::placeholder,
.widget-contact .contact-right form .fields textarea::placeholder{
    color: #aaa;
    font-size: 15px;
    letter-spacing: .5px;
}
.widget-contact .contact-right form .fields-btn{}
.widget-contact .contact-right form .fields-btn button{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: .5px;
    transition: .2s linear;
    position: relative;
    z-index: 1;
    font-weight: 500;
    text-transform: uppercase;
    color: #fff;
    padding: 8px 20px;
    border-radius: 3px;
    background: linear-gradient(45deg, #342e92, #00a6ff);
    border: none;
    outline: none;
}
.widget-contact .contact-right form .fields-btn button:hover{
    background: linear-gradient(45deg, #00a6ff, #342e92);;
}

/*===================
    widget blogs
===================*/
.widget-blogs{
    background: #fff;
    padding: 50px 40px;
}
.widget-blogs .gridblogs-box{
    background: #fff;
}
.widget-blogs .gridblogs-box .gridimg{
    overflow: hidden;
}
.widget-blogs .gridblogs-box .gridimg img{width: 100%;transition: .2s linear;}
.widget-blogs .gridblogs-box .gridimg:hover img{
    transform: scale(1.05);
}
.widget-blogs .gridblogs-box .content{
    padding: 20px;
    text-align: center;
}
.widget-blogs .gridblogs-box .content .date{
    color: var(--primary-color);
    letter-spacing: 4px;
    font-size: .9em;
    display: block;
    padding: 0 0 10px;
}
.widget-blogs .gridblogs-box .content .title{
    font-size: 1.2em;
    line-height: 1.3;
    font-weight: 400;
    transition: .2s linear;
}
.widget-blogs .gridblogs-box .content .title:hover{
    color: var(--secondary-color);
}
.widget-blogs .gridblog-one{
    text-align: center;
}
.widget-blogs .gridblog-one .content1{
    margin: 0 0 20px;
}
.widget-blogs .gridblog-one .content1 .date{
    font-size: 1.4em;
    font-weight: 200;
}
.widget-blogs .gridblog-one figure{}
.widget-blogs .gridblog-one figure img{
    width: 100%;
}
.widget-blogs .gridblog-one .content2{}
.widget-blogs .gridblog-one .content2 p{
    font-size: 15px;
}
.widget-blogs .gridblog-one .content2 ul{}
.widget-blogs .gridblog-one .content2 ul li{}

.widget-blogs .gridblog-one-right{
    height: 100%;
    background: #1f1a6b14;
}
.widget-blogs .gridblog-one-right .title{
    background: #1f1a6b;
    padding: 10px;
}
.widget-blogs .gridblog-one-right .title h3{
    font-size: 18px;
    color: #fff;
}
.widget-blogs .gridblog-one-right .recent-blogs{
    padding: 15px;
}
.widget-blogs .gridblog-one-right .recent-blogs .blogbox{
    display: flex;
    gap: 10px;
}
.widget-blogs .gridblog-one-right .recent-blogs .blogbox figure{
    width: 40%;
}
.widget-blogs .gridblog-one-right .recent-blogs .blogbox figure img{
    width: 100%;
}
.widget-blogs .gridblog-one-right .recent-blogs .blogbox .content{
    width: 70%;
}
.widget-blogs .gridblog-one-right .recent-blogs .blogbox .content .heading{
    font-size: 13px;
    line-height: 1.3;
    display: inline-block;
    transition: .3s linear;
}
.widget-blogs .gridblog-one-right .recent-blogs .blogbox:hover .content .heading{
    color: var(--primary-color);
}
.widget-blogs .gridblog-one-right .recent-blogs .blogbox .content .date{
    font-size: 13px;
    color: #aaa;
    line-height: 1;
    display: inline-block;
}


/*===================
    widget aboutus
===================*/
.widget-aboutus{
    padding: 50px 0;
}
.widget-aboutus .aboutusimg{
    background: #fff;
    position: relative;
    z-index: 1;
}
.widget-aboutus .aboutusimg:before{
    content: "";
    width: 130%;
    height: 110%;
    background: tomato;
    position: absolute;
    top: 10%;
    left: 15%;
    z-index: -1;
}
.widget-aboutus .aboutusimg img{width: 100%;}
.widget-aboutus .aboutus-content{
    padding: 40px;
    position: relative;
    z-index: 1;
    margin: 20% 0 0 -80px;
    background: #ffffffe0;
    box-shadow: 5px 5px 10px 1px #00000012;
}
.widget-aboutus .aboutus-content h3{
    font-size: 40px;
    font-weight: 700;
    color: tomato;
    position: relative;
    text-transform: uppercase;
    margin: 0 0 10px;
}
.widget-aboutus .aboutus-content span{
    font-size: 18px;
    margin: 0 0 10px;
    font-style: italic;
    color: #aaa;
    display: block;
}
.widget-aboutus .aboutus-content p{
    margin: 0 0 15px;
    font-size: 17px;
    font-weight: 300;
}


.homefirst-mob{
    background: #fff;
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 999;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: url('../images/bkbg.webp');
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
}
.homefirst-mob:before{
    content: "";
    width: 100%;
    height: 100%;
    background: #ffffffed;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}
.homefirstslider{text-align: center;padding: 0 30px;}
.homefirstslider h3{
    font-weight: 300;
    color: var(--primary-color);
    margin: 0 0 40px;
    font-size: 24px;
}
.homefirstslider figure{
    margin: 0 0 30px;
    width: 200px;
    display: block;
    margin: 0 auto 10px;
}
.homefirstslider figure img{width: 100%;}
.homefirstslider .getstart{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: .5px;
    transition: .2s linear;
    position: relative;
    z-index: 1;
    font-weight: 500;
    text-transform: uppercase;
    color: #fff;
    padding: 8px 20px;
    border-radius: 3px;
    background: linear-gradient(45deg, #342e92, #00a6ff);
}
.homefirstslider .getstart:hover{
    background: linear-gradient(45deg, #00a6ff, #342e92);
}
.homefirst-mob .innersecondbox{
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 99;
    padding: 0 0 100px;
    text-align: center;
    width: 100%;
}
.homefirst-mob .innersecondbox figure{
    margin: 0 0 40px;
}
.homefirst-mob .innersecondbox figure img{width: 200px;}
.homefirst-mob .innersecondbox a{
    display: inline-block;
    background: linear-gradient(45deg, var(--primary-color), var(--primary-color));
    padding: 6px 15px;
    border-radius: 4px;
    color: #fff;
    font-size: 14px;
    letter-spacing: 1px;
    font-weight: 200;
}

.mobheader{
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #ffffff;
    padding: 10px;
    box-shadow: -1px -4px 9px 0px #252525;
    position: relative;
    z-index: 9;
}
.mobheader.fix{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #fff;
    z-index: 999999;
}
.mobheader a.moblogo{}
.mobheader img{width: 180px;transform: translateY(-4px);}
.mobheader a.open_stud_panel{font-size: 24px;display: inline;margin: 0 10px 0 0;}
.mobheader a.open_stud_panel{
    color: #000;
}
.aftermobheader{
    padding: 10px 0 10px;
    background: #fff;
    position: relative;
    z-index: 2;
}
.aftermobheader p{
    font-size: 13px;
    text-align: center;
    font-weight: 600;
    color: #000;
}


.homesecond-mob{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, #f2e8ff, #def4ff);
    z-index: 1000;
}
.mobinnerbox .innerbox{
    background: #fff;
    border-radius: 10px;
    margin: 0 0 15px;
    padding: 20px 10px;
    box-shadow: 0 10px 20px -20px #000000e0;
    display: inline-block;
    width: 49%;
    text-align: center;
}
.mobinnerbox .innerbox:nth-child(3){margin: 0 0 0 2px;}
.mobinnerbox .innerbox figure{
    margin: 0;
    width: 80px;
    aspect-ratio: 1;
    position: relative;
    z-index: 1;
    margin: 0 auto 10px;
}
.mobinnerbox .innerbox figure:before{
    content: "";
    width: 85%;
    height: 85%;
    border-radius: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    transform: translate(-50%, -50%);
}
.mobinnerbox .innerbox:nth-child(1) figure:before{
    background: #08acd1;    
}
.mobinnerbox .innerbox:nth-child(2) figure:before{
    background: #e1a112;
}
.mobinnerbox .innerbox figure img{
    width: 80px;
}
.mobinnerbox .innerbox span{
    font-weight: 600;
}
.mobinnerbox .innerbox:nth-child(1) span{
    color: #08acd1;
}
.mobinnerbox .innerbox:nth-child(2) span{
    color: #e1a112;    
}


.stud_sidepanel{
    position: fixed;
    top: 0;
    right: -250px;
    background: #fff;
    width: 200px;
    height: 100vh;
    z-index: 99999;
    transition: .3s linear;
}
.stud_sidepanel.active{
    right: 0;
}
.stud_sidepanel .title{
    padding: 10px; 
    text-align: center; 
    border-bottom: 1px solid #eee;
}
.stud_sidepanel .title img{width: 60%;}
.stud_sidepanel .stud_panelclose{
    font-size: 24px;
    color: var(--primary-color);
    position: absolute;
    top: 5px;
    left: 5px;
}


.homethird-mob{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, #f2e8ff, #def4ff);
    z-index: 1001;
    /* padding: 20px; */
    overflow: auto;
}
.mobinnerbox{
    padding: 15px;
}



/*=======================
for student panel mobile
=======================*/
.homethird-mob .mobinnerbox{
    padding: 10px 15px;
}
.homethird-mob .mobbanner{}
.homethird-mob .mobbanner .sliderimgmob{
    border-radius: 5px;
    overflow: hidden;
}
.homethird-mob .mobbanner .slick-dots{
    display: none !important;
}
.homethird-mob .mobbanner .sliderimgmob img{width: 100%; border-radius: 5px;}
.homethird-mob .mob-links{
    background: #fff;
    padding: 0px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    white-space: nowrap;
    box-shadow: 0 5px 15px -8px #000000a8;
    margin: 15px 0 20px;
}
.homethird-mob .mob-links a{
    flex: 1 0 42%;
    color: #fff;
    padding: 25px 10px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.homethird-mob .mob-links a i{font-size: 2em;}
.homethird-mob .mob-links a span{
    font-size: 16px;
    font-weight: 300;
}
.homethird-mob .mob-links a:nth-child(1){
    background: #feb000;
}
.homethird-mob .mob-links a:nth-child(2){
    background: #4CAF50;
}
.homethird-mob .mob-links a:nth-child(3){
    background: #2a99ff;
}
.homethird-mob .mob-links a:nth-child(4){
    background: #1f1a6b;
}

.homethirdbooks{
    /* box-shadow: 0 4px 20px -15px #000; */
    /* background: linear-gradient(45deg, #d2d7ff, #caeeff, #f3ffc4); */
    /* padding: 10px; */
    border-radius: 5px;
    gap: 5px;
    margin: 0 0 30px;
}
.homethirdbooks .title{
    margin: 0 0 5px;
    background: #fff;
    padding: 10px;
    box-shadow: 0px 4px 6px #00000012;
}
.homethirdbooks .title a{
    font-size: 15px;
    color: var(--primary-color);
    font-weight: 500;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.homethirdbooks .title a:before,
.homethirdbooks .title a:after{
    content: "";
    width: 40px;
    height: 1px; 
    background: var(--primary-color);
    display: block;
}
.homethirdbooks .title a i{
    width: 25px;
    height: 25px;
    background: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    box-shadow: 0 2px 5px -3px #000;
    border: 2px solid #eee;
}
.homethirdbooks .title a{
    color: var(--primary-color);
}

.homethirdbooks .books{
    gap: 13px;
    width: 100%;
    display: flex;
    overflow: auto;
}
.homethirdbooks .books::-webkit-scrollbar{
    width: 0;
}
.homethirdbooks .books .bookgrid{
    flex: 0 0 35%;
    box-shadow: 0 0 4px 0 #00000038;
    overflow: hidden;
    border-radius: 5px;
    margin: 5px 4px;
    background: #fff;
    padding: 0 0 8px;
}
.homethirdbooks .books .bookgrid figure{
    margin: 0;
}
.homethirdbooks .books .bookgrid figure img{width: 100%;}
.homethirdbooks .books .bookgrid span{
    font-size: 13px;
    font-weight: 600;
    padding: 5px 10px 0px;
    text-align: center;
    display: block;
}
.homethirdbooks .books .bookgrid p{
    font-size: 12px;
    color: #1F1A6B;
    font-weight: 500;
    text-align: center;
}
.homethirdbooks .books + .viewallbooks{
    font-size: 13px;
    text-align: center;
    margin: 15px 0 0;
}

.homefourth-mob{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, #f2e8ff, #def4ff);
    z-index: 1002;
    overflow: auto;
}
.homefourth-mob > .title{
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #ffffff;
    padding: 10px;
    box-shadow: -1px -4px 9px 0px #252525;
    position: relative;
    z-index: 9;
}
.homefourth-mob > .title h3{
    font-size: 15px;
    font-weight: 500;
    color: var(--primary-color);
    display: flex;
    align-items: center;
}
.homefourth-mob > .title h3 img{width: 120px;transform: translateY(-4px);}
.homefourth-mob > .title a{
    font-size: 24px;
    display: inline;
    margin: 0 10px 0 0;
    color: #000;
}
.homefourth-mob > .title a.open_stud_panel{
}
.homefourth-mob .welcome{
    padding: 10px 0 10px;
    background: #fff;
    position: relative;
    z-index: 2;
}
.homefourth-mob .welcome p{
    font-size: 13px;
    text-align: center;
    font-weight: 600;
    color: #000;
}
.homefourth-mob .books-list{
    display: flex;
    align-items: start;
    flex-wrap: wrap;
    gap: 10px;
    padding: 15px;
}
.homefourth-mob .books-list .booklist-grid{
    width: 31%;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 5px -2px #0000006b;
}
.homefourth-mob .books-list .booklist-grid figure{
    margin: 0;
}
.homefourth-mob .books-list .booklist-grid figure img{width: 100%;}
.homefourth-mob .books-list .booklist-grid span{
    font-size: 13px;
    font-weight: 600;
    padding: 5px 10px 0px;
    text-align: center;
    display: block;
}
.homefourth-mob .books-list .booklist-grid p{
    font-size: 12px;
    color: #1F1A6B;
    font-weight: 500;
    text-align: center;
}

/*=========================
    mob teacher login
=========================*/

.teacherlogin{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, #f2e8ff, #def4ff);
    z-index: 1002;
    overflow: auto;
}
.teacherlogin > .title{
}
.teacherlogin > .title h3{
    font-size: 15px;
    font-weight: 500;
    color: var(--primary-color);
}
.teacherlogin > .title h3 img{width: 120px;transform: translateY(-8px);}
.teacherlogin > .title a{}

.teacherloginbox{
    padding: 20px;
}
.teacherloginbox figure{text-align: center;}
.teacherloginbox figure img{width: 80px;}
.teacherloginbox .logintitle{
    text-align: center;
    margin: 0 0 5px;
}
.teacherloginbox .logintitle h3{
    font-size: 16px;
    color: var(--primary-color);
}
.teacherloginbox .logintitle p{
    font-size: 14px;
    color: #aaa;
}
.teacherloginbox form{}
.teacherloginbox form .fields{
    margin: 0 0 10px;
}
.teacherloginbox form .fields label{
    font-size: 13px;
    font-weight: 500;
    color: var(--primary-color);
}
.teacherloginbox form .fields input{
    width: 100%;
    padding: 10px 10px 10px 50px;
    border: 1px solid #1f1a6b36;
    border-radius: 5px;
    outline: none;
}
.teacherloginbox form .fields input:focus{
    border: 1px solid #1f1a6b36;
}
.teacherloginbox form .fields .passinpt{
    position: relative;
    z-index: 1;
}
.teacherloginbox form .fields .passinpt a{
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 99;
    color: #ccc;
}
.teacherloginbox form .fields .passinpt i{
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 99;
    color: var(--secondary-color);
    font-size: 22px;
    border-right: 1px solid #1f1a6b26;
    padding: 0 10px 0 0;
    line-height: 1;
}
.teacherloginbox form .fields-btn{
    margin: 20px 0 0;
}
.teacherloginbox form .fields-btn button{display: flex;align-items: center;justify-content: center;letter-spacing: .5px;transition: .2s linear;position: relative;z-index: 1;font-weight: 500;text-transform: uppercase;color: #fff;padding: 8px 20px;border-radius: 3px;background: linear-gradient(45deg, #342e92, #00a6ff);outline: none;border: none;width: 100%;}
.teacherloginbox form .fields-btn button:hover{
    background: var(--secondary-color);
}


/* ==========================
    teacher account
========================== */
.account-widget{
    padding: 50px 0;
}
.account-widget .account-info{
    position: relative;
}
.account-widget a.logout{
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 9;
    font-size: 13px;
    font-weight: 500;
        color: #252525;
    transition: .3s linear;
}
.account-widget a.logout:hover{
    color: skyblue;
}
.account-widget a.logout:hover{}
.account-widget .full-name{
    display: flex;
    align-items: center;
    padding-bottom: 10px;
    gap: 20px;
}
.account-widget .full-name h3{
    font-weight: 700;
    color: var(--primary-color);
    color: #000;
}
.account-widget .full-name span{
    width: 50px;
    height: 50px;
    background: var(--primary-color);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 25px;
    border-radius: 50px;
    font-weight: 600;
    color: var(--secondary-color);
    text-transform: uppercase;
}
.account-widget .user-details{
    padding: 15px 0;
    border-top: 1px solid #eee;
}
.account-widget .user-details p{
    font-weight: 300;
    padding-bottom: 5px;
    font-size: 18px;
    color: #252525;
}
.account-widget .user-details p img{
    margin-right: 5px;
    width: 20px;
}
.account-widget .user-details p:nth-child(1){}
.account-widget .user-details p:nth-child(2){}
.account-widget .sidepanel{
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 0 0 40px;
    border-bottom: 1px solid #efefef;
    box-shadow: 2px 2px 6px 3px #eee;
    box-shadow: 3px 3px 0 0 #ebebed;
    padding: 10px;
    background: #ff00000d;
    background: #1476d326;
}
.account-widget .sidepanel li:nth-child(1){}
.account-widget .sidepanel li:nth-child(2){
    margin-right: 5px;
    padding-left: 15px;
    border-left: 1px solid #1f1a6b24;
}
.account-widget .sidepanel .list{
    border-radius: 3px;
    align-self: center;
    margin-left: auto;
}
.account-widget .sidepanel .list .link{
    font-size: 0.9em;
    font-weight: 500;
    color: #000000;
    transition: .2s linear;
    display: flex;
    align-items: center;
}
.account-widget .sidepanel .list .link:hover{
    color: var(--primary-color)
}
.account-widget .sidepanel .list .link i{
    font-size: 1.1em;
    margin: 0 5px 0 0;
}
.account-widget .sidepanel li .nameletter{
    width: 50px;
    height: 50px;
    display: block;
    border-radius: 5px;
    line-height: 48px;
    text-align: center;
    font-size: 1.3em;
    font-weight: 900;
    background: var(--secondary-color);
    /* border: 2px solid var(--primary-color); */
    font-family: var(--secondary-font);
    text-transform: uppercase;
    color: var(--primary-color);
}
.account-widget .sidepanel li p{
    font-size: 0.9em;
    color: #666;
}
.account-widget .sidepanel li p span:nth-child(1){
    font-size: 16px;
    font-weight: 600;
    display: block;
    color: #444;
    text-transform: uppercase;
    line-height: 1.2;
}
.account-widget .sidepanel li p span:nth-child(2){
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    color: #000;
    font-size: 15px;
}
.account-inner-page{
    border-top: 1px solid #eee;
    padding: 20px 0 0;
}
.teacherbook{
}
.account-inner-page .inner-page-title{
    margin: 0 0 20px;
}
.account-inner-page .inner-page-title h2{
    font-size: 22px;
    font-weight: 500;
}
.account-inner-page .inner-page-title h2 i{
    font-size: .9em;
    margin: 0 5px 0 0;
}
.teacherbook .teacher_bk{
    margin: 0 0 20px;
    position: relative;
    z-index: 1;
    background: #eee;
    padding: 20px 15px;
    display: flex;
    gap: 10px;
}
.teacherbook .teacher_bk figure{
    width: 30%;
    text-align: center;
    margin: 15px 0 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.teacherbook .teacher_bk figure img{width: 90%;}
.teacherbook .teacher_bk .profilebtns span{
    font-size: 20px;
    font-weight: 500;
    border-radius: 3px;
    display: inline-block;
    margin: 0 0 10px;
}
.teacherbook .teacher_bk .profilebtns{
    display: flex;
    margin: 0;
    flex-direction: column;
    width: 70%;
}
.teacherbook .teacher_bk .profilebtns .btnss{
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
}
.teacherbook .teacher_bk .profilebtns .btnss a{
    font-size: 14px;
    width: 100%;
    text-align: center;
    color: #fff;
    padding: 5px;
    font-weight: 500;
    border-radius: 3px;
    transition: .3s linear;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.teacherbook .teacher_bk .profilebtns .btnss a:hover{}
.teacherbook .teacher_bk .profilebtns .btnss a.view{
    background: #ffbc00;
}
.teacherbook .teacher_bk .profilebtns .btnss a.view:hover{
    background: #e9ac00;
}
.teacherbook .teacher_bk .profilebtns .btnss a.download{
    background: #00c4ff;
}
.teacherbook .teacher_bk .profilebtns .btnss a.download:hover{
    background: #02baf1;
}

/*===================
 widget book read page
===================*/
.widget-bookread{
    padding: 50px 40px;
    background: #ffffff;
}
.widget-bookread .backlink{
    margin: 0 0 15px;
}
.widget-bookread .backlink a{
    display: inline-block;
    background: var(--primary-color);
    padding: 4px 10px;
    border-radius: 2px;
    color: #fff;
    font-size: 14px;
    letter-spacing: 1px;
}
.widget-bookread.active{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.widget-bookread .bookcodepanelclose{
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 25px;
    transition: .2s linear;
}
.widget-bookread .bookcodepanelclose:hover{
    color: var(--primary-color);
}
.widget-bookread .widget-bookreadinner{
    display: flex;
    align-items: center;
    justify-content: center;
}
.widget-bookread .gridbook-box{}

.widget-bookread .gridbook-box figure{
    margin: 0;
}
.widget-bookread .gridbook-box figure img{
    width: 100%;
}
.widget-bookread .gridbook-code .heading{
    text-align: center;
}
.widget-bookread .gridbook-code .heading h3{
    font-size: 1.6em;
    color: var(--primary-color);
    text-transform: uppercase;
    font-weight: 400;
}
.widget-bookread .gridbook-code .heading span{
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #c3c3c3;
}
.widget-bookread .gridbook-code{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #fff;
    gap: 20px;
    padding: 20px;
    box-shadow: 5px 5px 15px -10px #00000094;
    border-radius: 10px;
    box-shadow: 3px 3px 0 0 #eee;
}
.widget-bookread .gridbook-code .enterbookcode{text-align: center;display: flex;flex-direction: column;gap: 10px;}
.widget-bookread .gridbook-code .enterbookcode a{
        padding: 8px 15px;
        border-radius: 3px;
        display: flex;
        transition: .3s linear;
        font-size: 16px;
        font-weight: 500;
        border: 1px solid #1f1a6b30;
        color: #000;
        align-items: center;
        justify-content: center;
        gap: 5px;
        background: #6689FF;
        color: #fff;
}
.widget-bookread .gridbook-code .enterbookcode a:nth-child(1){
    background: #FC7BF9;
}
.widget-bookread .gridbook-code .enterbookcode a i{
    color: #ffffff;
    font-size: 18px;
}
.widget-bookread .gridbook-code .enterbookcode a:hover{
    background: var(--secondary-color);
}
.widget-bookread .gridbook-code .enterbookcode a:hover i{
    color: #fff;
}
.widget-bookread .gridbook-video{
    padding: 10px 10px 25px;
    box-shadow: 2px 2px 14px 0px #0000003d;
    margin: 0 0 20px;
}
.widget-bookread .gridbook-video figure{
    margin: 0 0 5px;
}
.widget-bookread .gridbook-video figure img{width: 100%; height: 207px;}
.widget-bookread .gridbook-video .heading{
    text-align: center;
}
.widget-bookread .gridbook-video .heading span{
    background: var(--primary-color);
    color: #ffff;
    border-radius: 2px;
    padding: 4px 10px;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 1px;
    margin: 0 0 10px;
    display: inline-block;
}
.widget-bookread .gridbook-video .heading h3{
    font-size: 20px;
    font-weight: 400;
}



.paperwidget{
    background: #ed1c241c;
    padding:30px 0;
    min-height: 500px;
} 
.paperwidget .pagehead{
    padding-bottom: 20px;
}
  .paperwidget .pagehead h3{
    font-family: 'Barlow', sans-serif;
    font-size: 2em;
    font-weight: 700;
    text-align: CENTER;
    margin: 0;
    letter-spacing: 1;
    color: #000000;
}
  .paperwidget .pagehead h4{
    text-align: CENTER;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 20px;
    color: #000;
    }



.paperwidget .bookhead{}
  .paperwidget .bookhead h3{
    margin: 0;
    text-align: center;
    font-family: 'Barlow', sans-serif;
    font-size: 2em;
    font-weight: 700;
    color: #ed1c24;
    margin-bottom: 10px;
    }
  .paperwidget .listgridchapter{
    background: #fff;
    padding: 15px;
    border: 1px solid #fde6e7;
    box-shadow: #fde6e7 -1px 2px 0 0;
    border-radius: 5px;
    margin-bottom: 10px;
}
  .paperwidget .listgridchapter select{
    width: 100%;
    padding: 10px;
    border: 2px solid #fde6e7;
    border-radius: 3px;
    outline:
    none;
    margin-bottom: 9px;
}
  .paperwidget .queslistdata{
    padding: 0 5px;
}
  .paperwidget .queslistdata .innerbox{
    background: #fff;
    padding: 15px;
    border: 1px solid #fde6e7;
    box-shadow: #fde6e7 -1px 2px 0 0;
    border-radius: 5px;
    min-height: 310px;
}
.paperwidget .queslistdata .innerbox .paper-top-panel{
    margin: 0 0 20px;
}
.paperwidget .queslistdata .innerbox .time{}
.paperwidget .queslistdata .innerbox .time label{}
.paperwidget .queslistdata .innerbox .time label input{
    border: none;
    outline: none;
}
.paperwidget .queslistdata .innerbox .marks{
    text-align: end;
}
.paperwidget .queslistdata .innerbox .marks label{
    font-weight: 500;
}
.paperwidget .queslistdata .innerbox .marks label span{}
.paperwidget .queslistdata .innerhead{}
.paperwidget .queslistdata .innerhead h3{
    text-align: center;
    font-family: 'Barlow', sans-serif;
    font-size: 22px;
    font-weight: 500;
    color: #000;
    margin-top: 0;
    text-transform: uppercase;
}
 
 .paperwidget   .innertext{
    padding: 0 10px;
}
 .paperwidget  .innertext input{
    width: 100%;
    padding: 10px;
    border: none;
    margin-bottom: 3px;
    background: #ffffff;
    outline: none;
    border: 2px solid #fde6e7;
    text-align: CENTER;
    font-family: 'Barlow', sans-serif;
    font-weight: 700;
    color: #000;
    border-radius: 4px;
}


 .paperwidget .btn-box{
    margin-top: 15px;
    background: #fff;
    padding: 15px;
    border: 1px solid #fde6e7;
    box-shadow: #fde6e7 -1px 2px 0 0;
    border-radius: 5px;
    text-align: CENTER;
}
 .paperwidget .btn-box .printbtn{
    background: #2196f3;
    color: #fff;
    border: none;
    padding: 5px 20px;
    border-radius: 3px;
    font-family: 'Barlow', sans-serif;
    font-size: 16px;
    font-weight: 500;
}
 .paperwidget .btn-box .savebtn{
    background: #4caf50;
    color: #fff;
    border: none;
    padding: 5px 20px;
    border-radius: 3px;
    font-family: 'Barlow', sans-serif;
    font-size: 16px;
    font-weight: 500;
}

.paperwidget .quehead{
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    font-family: 'Barlow', sans-serif;
    margin-bottom: 5px;
    position: relative;
    padding-right: 80px;
}


.paperwidget .quehead .innerno{
    position: absolute;
    top: 0;
    right: 0;
}
.paperwidget .quehead .innerno .noques{
    display: inline-block;
}
.paperwidget .quehead .innerno input[type='text']{
    display: inline-block;
    width: 40px;
}
.paperwidget .quehead .innerno .totalmarks{
    display: inline-block;
}


.paperwidget .listques{
    padding-left: 5px;
    list-style: none;
    color: #000;
    font-size: 17px;
    font-family: 'Barlow', sans-serif;
    /* margin-bottom: 5px; */
}
.paperwidget .listques li{
    cursor: pointer;
    padding-bottom: 6px;
    display: flex;
    align-items: center;
}
.paperwidget .listques.omrsheet li{
    flex-direction: column;
    align-items: start;
}
.paperwidget .listques li .omrans{
    display: flex;
    align-items: start;
    justify-content: start;
    margin: 0 0 10px;
    width: 100%;
}
.paperwidget .listques li .omrans span{
    flex-basis: 25%;
}
.paperwidget .listques li .sidea{
    width: 50%;
    display: inline-block;
}
.paperwidget .listques li .sideb{
    display: inline-block;
    text-transform: capitalize;
}
.paperwidget .listques li .bubbleicon{
    display: inline-block;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 15px;
    background: #ffc107;
    padding-top: 1px;
}


.paperwidget .datashowquestion .paperlist{
    padding-left: 5px;
    list-style: none;
    color: #000;
    font-size: 17px;
    font-family: 'Barlow', sans-serif;
    margin-bottom: 25px;
}

.paperwidget .datashowquestion .paperlist li{
    position: relative;
    padding-right: 50px;
}
.paperwidget .datashowquestion .paperlist li .omrans{
    display: flex;
    align-items: start;
    justify-content: start;
    margin: 0 0 10px;
}
.paperwidget .datashowquestion .paperlist li .omrans span{
    flex-basis: 25%;
}
.paperwidget .datashowquestion .paperlist li .sidea{
    width: 50%;
    display: inline-block;
}
.paperwidget .datashowquestion .paperlist li .sideb{
    display: inline-block;
    text-transform: capitalize;
}
.paperwidget .datashowquestion .paperlist li .bubbleicon{
    display: inline-block;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 15px;
    background: #ffc107;
    padding-top: 1px;
}

.paperwidget .datashowquestion .paperlist li .delitem{
    position: absolute;
    right: 0;
    position: absolute;
    right: 0;
    background: none;
    border: none;
    top: 5px;
    color: #ff1100;
    font-size: 18px;
}

.paperwidget .datashowquestion .paperlist li .edititem{
    position: absolute;
    right: 0;
    position: absolute;
    right: 22px;
    background: none;
    border: none;
    top: 6px;
    color: #2196f3;
    font-size: 18px;
}
.msgdatapaper{position: fixed;
    bottom: 0;
    left: 0;
    right: 0;}
    .msgdatapaper .alert{margin-bottom:0;}
.modalbox-edit{
    position: fixed;
    z-index: 999;
    background: #000000c7;
    left: 0;
    right: 0;
    bottom: 0;
    top: -100%;
    opacity:0;
    visibility:hidden;   transition: width 2s;
    
}    
.modalbox-edit .innerbox{
    margin: 0 auto;
    position:relative;
    width: 450px;
     
    background: #fff;
    padding: 15px;
}    
.closebtnpop{
    position: absolute;
    bottom: 15px;
    right: 15px;
    background: #000;
    border: none;
    color: #fff;
    font-size: 14px;
    text-transform: uppercase;
    padding: 3px 10px;
    }
    
.modalbox-edit .innerbox .dataloadpopup{
    font-family: 'Barlow', sans-serif;
}
.modalbox-edit .innerbox .dataloadpopup h3{
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    font-family: 'Barlow', sans-serif;
    margin-bottom: 5px;
}
.modalbox-edit .innerbox .dataloadpopup label{
    display: block;
}
.modalbox-edit .innerbox .dataloadpopup textarea{
    width: 100%;
    margin-bottom: 6px;
    border: 2px solid #eee;
    padding: 10px;
    border-radius: 7px;
}
.modalbox-edit .innerbox .dataloadpopup input[type='text']{
    width: 100%;
    margin-bottom: 6px;
    border: 2px solid #eee;
    padding: 10px;
    border-radius: 7px;
}
.modalbox-edit .innerbox .dataloadpopup button{
    display: inline-block;
    background: #4caf50;
    border: none;
    color: #fff;
    padding: 4px 10px;
    border-radius: 2px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1px;
    margin-top: 10px;
}
  .modalbox-edit .innerbox .dataloadpopup .padd5{padding:0 0;}
  
  .widget-paperbookcat .gridbook-box{
    display: flex;
    width: 100%;
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin: 0 0 20px;
    transition: .2s linear;
    background: #fff;
    padding: 10px 10px 20px;
    border-radius: 5px;
    box-shadow: 0 5px 10px -10px #00000061;
}

.widget-paperbookcat .gridbook-box figure{
    width: 30%;
    position: relative;
    z-index: 1;
    text-align: center;
    margin: 0;
}
.widget-paperbookcat .gridbook-box figure img{
    width: 100%;
}
.widget-paperbookcat .gridbook-box .heading{
    width: 70%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 30px;
}
.widget-paperbookcat .gridbook-box .heading .tagnavkar{
    font-size: 12px;
    color: #333;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-weight: 500;
    position: relative;
    margin: 0 0 10px;
    display: inline-block;
}
.widget-paperbookcat .gridbook-box .heading .tagnavkar:before{
    content: "";
    width: 100px;
    height: 1px;
    background: #bbb;
    position: absolute;
    bottom: -5px     ;
    left: 50%;
    transform: translateX(-50%);
}
.widget-paperbookcat .gridbook-box .heading h3{
    font-size: 23px;
    font-weight: 600;
    transition: .3s linear;
    color: var(--primary-color);
    margin: 0 0 10px;
    margin: 0;
}
.widget-paperbookcat .gridbook-box .heading p{
    width: 100%;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-align: center;
    margin: 0 0 15px;
}
.widget-paperbookcat .gridbook-box .heading .viewbtn{
    font-weight: 500;
    font-size: 14px;
    transition: .3s linear;
}
.widget-paperbookcat .gridbook-box .heading .viewbtn:hover{
    color: red;
}