*,html{
        scroll-behavior: smooth;
        }
        
        *, *:after, *:before {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        }
        
        :root{
        scrollbar-color: rgb(210,210,210) rgb(46,54,69) !important;
        scrollbar-width: thin !important;
        --white:#fff;
        --black:#000;
        --dark:#2a2a2e;
        --yellow:#f7b500;
        --darkyellow:#f79300;
        --red:#fe3e30;
        --darkred:#f72729;
        --blue:#2588cf;
        --darkblue:#026dbe;
        --defaultfont:'Poppins', sans-serif;
        --titlefont:'Roboto', sans-serif;
        }
        
        ::-webkit-scrollbar {
        height: 12px;
        width: 6px;
        background: var(--dark);
        }
        
        ::-webkit-scrollbar-thumb {
        background: var(--dark);
        -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
        }
        
        ::-webkit-scrollbar-corner {
        background: var(--dark);
        }
        
        
        /********************************
                  DEFAULT
        *********************************/
        body{
        margin:0;
        overflow-x:hidden !important;
        font-family:var(--defaultfont);
        }
        
        a{
        text-decoration:none;
        color:inherit;
        }
        
        a, button, input, select, p{
        outline:none !important;
        transition:0.5s;
        } 
        
        em{
        font-style:normal;
        color:var(--primary);
        }
        
        p{
        line-height:1.6em;
        font-size:14px;
        color:rgba(1,1,1,0.7);
        }
        
        img{
        max-width:100%;
        }
        
        figure{
        margin:0;
        padding:0;
        }
        
        fieldset{
        width:100%;
        border:0;
        padding:0;
        margin:0;
        }
        
        .title{
        font-family:var(--titlefont);
        }
        
        .btn1, .btn2{
        padding:1rem 2rem;
        border-radius:10px;
        text-align:center;
        border:0;
        }
        
        .btn1{
        background-color:var(--yellow);
        color:var(--white);
        }
        
        .btn1:hover{
        background-color:var(--darkyellow);
        }
        
        .btn2{
        background-color:var(--red);
        color:var(--white);
        }
        
        .btn2:hover{
        background-color:var(--darkred);
        }
        
        
        
        
        /********************************
                  HEADER
        *********************************/
        header{
        width:100%;
        display:flex;
        align-items:center;
        justify-content:center;
        background-size:cover;
        background-repeat:no-repeat;
        }
        
        header section{
        width:auto;
        padding:8rem 1rem;
        position:relative;
        color:var(--white);
        }
        
        header section:after{
        content:"";
        position:absolute;
        background-color:var(--yellow);
        height:4px;
        width:100px;
        left:50%;
        transform:translate(-50%, 0);
        }
        
        header section .title{
        font-size:3em;
        line-height:0;
        }
        
        header section span{
        position:absolute;
        bottom:0;
        left:50%;
        transform:translate(-50%, 0);
        background-color:var(--yellow);
        padding:10px 20px;
        border-radius:10px 10px 0 0;
        white-space:nowrap;
        }
        
        header a:hover{
        color:var(--dark);
        }
        
        header .active{
        color:var(--dark);
        pointer-events:none;
        }
        
        @media (max-width:1000px){
        header section .title{
        font-size:1.5em;
        line-height:0.8;
        }
        }
        
        
        
        
        
        
        /********************************
                BLOG CONTAINER
        *********************************/
        .blog_container{
        width:100%;
        display:flex;
        align-items:top;
        background-color:#f1f1f1;
        }
        
        /*BLOG LEFT CONTENT*/
        .blog_content{
        padding:2rem;
        width:100%;
        }
        
        .blog_content .load-btn{
        display:block;
        width:150px;
        margin:5vh auto;
        }
        
        .left_content{
        display:flex;
        align-items:top;
        justify-content: space-between;
        flex-wrap:wrap;
        column-count: 2;
        gap: 20px 10px;
        flex:0 0 70%;
        }
        
        .right_content{
        flex:0 0 30%;
        }
        
        .blog_card{
        width:100%;
        flex:0 0 48.5%;
        overflow:hidden;
        background-color:var(--white);
        }
        
        .blog_card:nth-child(1){
        flex:0 0 100%;
        }
        
        .blog_card .figure{
        display:block;
        width:100%;
        height:200px;
        position:relative;
        overflow:hidden;
        }
        
        .blog_card:nth-child(1) .figure{
        height:300px;
        }
        
        .blog_card .figure img{
        width:100%;
        height:100%;
        object-fit:cover;
        transition:0.5s;
        }
        
        .blog_card .tag{
        padding:5px 10px;
        background-color:var(--yellow);
        color:var(--white);
        position:absolute;
        right:1%;
        top:3%;
        font-size:12px;
        }
        
        .blog_card section{
        padding:1rem;
        position:relative;
        background-color:var(--white);
        }
        
        .blog_card section .title{
        font-weight:600;
        font-size:18px;
        color:var(--dark);
        width:auto;
        }
        
        .blog_card section a:hover{
        color:var(--yellow);
        }
        
        .blog_card:hover > .figure img{
        transform:scale(1.1);
        }
        
        .share_icon{
        position:absolute;
        bottom:-30px;
        left:10px;
        background-color:var(--red);
        color:var(--white);
        display:flex;
        align-items:center;
        padding-right:5px;
        font-size:13px;
        cursor:pointer;
        transition:0.5s;
        }
        
        .share_icon .fa{
        padding:5px;
        background-color:var(--darkred);
        margin-right:10px;
        }
        
        .blog_card section img{
        width:30%;
        margin-right:20px;
        object-fit:cover;
        border:5px solid rgba(1,1,1,0.1);
        }
        
        .blog_card section img:nth-child(even){
        float:left;
        }
        
        .blog_card section img:nth-child(odd){
        float:right;
        }
        
        
        
        
        /*BLOG RIGHT CONTENT*/
        .columns{
        display:block;
        margin-bottom:4vh;
        background-color:var(--white);
        }
        
        .columns section{
        padding:1rem;
        }
        
        .columns .title{
        background-color:#1c443c;
        color:var(--white);
        padding:1rem;
        text-align:left;
        width:100%;
        display:block;
        transition:0.2s;
        border-left:0px solid var(--dark);
        }
        
        .columns:hover > .title{
        border-left:5px solid var(--dark);
        }
        
        .columns .title a{
        float:right;
        }
        
        .columns .title a:hover{
        color:var(--dark);
        }
        
        .search form{
        width:100%;
        display:flex;
        align-items:center;
        }
        
        .search fieldset:nth-child(2){
        width:10%;
        }
        
        .search form input{
        border:1px solid rgba(1,1,1,0.1);
        padding:1rem;
        width:100%;
        font-weight:600;
        color:rgba(1,1,1,0.5);
        }
        
        .search .btn1{
        border:1px solid var(--yellow);
        border-radius:0;
        }
        
        
        
        /*BOOKS*/
        .books .cards {
        position: relative;
        width: 100%;
        height:46vh;
        overflow: hidden;
        border-radius: 5px;
        background-color:#f1f1f1;
        }
        
        .books .cards::after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        z-index: 900;
        display: block;
        width: 100%;
        height: 100%;
        }
        
        .books .card_part {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 7;
        display: flex;
        align-items: center;
        width: 100%;
        height: 100%;
        background-size:100% 100%;
        background-position:center;
        transform: translateX( 700px );
        background-repeat:no-repeat;
        animation: opaqTransition 28s cubic-bezier(0, 0, 0, 0.97) infinite;
        background-color:#f1f1f1;
        }
        
        .books .card_part.card_part-two {
        z-index: 6;
        animation-delay: 7s;
        background-repeat:no-repeat;
        }
        
        .books .card_part.card_part-three {
        z-index: 5;
        animation-delay: 14s;
        background-repeat:no-repeat;
        }
        
        .books .card_part.card_part-four {
        z-index: 4;
        animation-delay: 21s;
        background-repeat:no-repeat;
        }
        
        @keyframes opaqTransition {
        3% { transform: translateX( 0 ); }
        25% { transform: translateX( 0 ); }
        28% { transform: translateX( -700px ); }
        100% { transform: translateX( -700px ); }
        }
        
        
        
        
        /*CATEGORIES*/
        .categories a{
        display:inline-block;
        padding:0.2rem 1rem;
        border-radius:40px;
        background-color:rgba(1,1,1,0.3);
        margin:5px 3px;
        font-size:12px;
        white-space:nowrap;
        color:var(--white);
        }
        
        .categories a:hover{
        background-color:var(--dark);
        }
        
        
        /*POSTS*/
        .posts a{
        display:flex;
        align-items:center;
        margin:0.4rem 0;
        }
        
        .posts a img{
        width:100px;
        margin-right:10px;
        }
        
        .posts a:hover > p{
        color:var(--black);
        }
        
        
        
        /*COMMENTS*/
        .comments{
        position:relative;
        overflow:hidden;
        max-height:60vh;
        }
        
        .marquee2 {
        position: relative;
        overflow:hidden;
        line-height:1.6em;
        }
        
        .marquee2 p{
        border-bottom:1px solid rgba(1,1,1,0.1);
        position:relative;
        padding:0.4rem 0;
        }
        
        .marquee2 p:before{
        content:"\f10d";
        font-family:"FontAwesome";
        margin-right:5px;
        position:relative;
        top:-5px;
        }
        
        @keyframes marquee1 {
        0% {
        top: 10%;
        }
        100% {
        top: -100%;
        }
        }
        
        
        /*SOCIAL MEDIA*/
        .social_icons{
        display:flex;
        align-items:center;
        justify-content:center;
        column-gap: 15px;
        background-color:transparent;
        }
        
        .social_icons .fa{
        padding:7px 13px;
        background-color:#f1f1f1;
        color:var(--white);
        transition:0.2s;
        }
        
        .social_icons a:hover > .fa{
        transform:scale(1.1);
        }
        
        .social_icons .fa-facebook{
        background-color:#3b5998;
        }
        
        .social_icons .fa-instagram{
        background-color:#fb3958;
        }
        
        .social_icons .fa-youtube{
        background-color:#c4302b;
        }
        
        .social_icons .fa-whatsapp{
        background-color:#25d366;
        }
        
        .social_icons .fa-telegram{
        background-color:#3399ff;
        }
        
        
        @media (max-width:1000px){
        .blog_container{
        flex-wrap:wrap;
        }
        .blog_content{
        padding:0;
        order:2;
        }
        .left_content{
        flex:0 0 100%;
        order:2;
        padding:1rem;
        }
        .right_content{
        flex:0 0 100%;
        order:1;
        padding:1rem;
        }
        .books,.posts, .comments, .categories{
        display:inline-block;
        width:47%;
        margin:1.3%;
        margin-bottom:0;
        vertical-align:top;
        height:63vh;
        }
        .posts{
        overflow-y:auto;
        }
        .right_content{
        flex:0 0 100%;
        }
        }
        
        @media (max-width:740px){
        .blog_card{
        flex:0 0 100%;
        }
        .posts, .comments, .books, .categories{
        width:100%;
        margin:0;
        height:auto;
        margin-bottom:4vh;
        }
        }
        
        
        
        
        
        
        /*REMOVE THIS*/
        .credits{
        position:fixed;
        right:0;
        bottom:2%;
        background-color:#1e1e1e;
        padding:0.5rem;
        font-size:12px;
        z-index:999;
        color:rgba(255,255,255,0.7);
        }
        
        .credits a{
        color:rgba(255,255,255,0.7);
        }
        
        .credits a:hover{
        color:white;
        }
        
        .credits .btn0{
        background-color:white;
        color:#000;
        padding:5px;
        border-radius:5px;
        border:0;
        display:block;
        margin:1vh auto;
        width:100px;
        text-align:Center;
        }
        
        .credits .btn0:hover{
        color:black;
        background-color:#b8bca7;
        }
        
        
        
    
        
    *,html{
        scroll-behavior: smooth;
        }
        
        *, *:after, *:before {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        }
        
        :root{
        scrollbar-color: rgb(210,210,210) rgb(46,54,69) !important;
        scrollbar-width: thin !important;
        --white:#fff;
        --black:#000;
        --dark:#2a2a2e;
        --yellow:#f7b500;
        --darkyellow:#f79300;
        --red:#fe3e30;
        --darkred:#f72729;
        --blue:#2588cf;
        --darkblue:#026dbe;
        --defaultfont:'Poppins', sans-serif;
        --titlefont:'Roboto', sans-serif;
        }
        
        ::-webkit-scrollbar {
        height: 12px;
        width: 6px;
        background: var(--dark);
        }
        
        ::-webkit-scrollbar-thumb {
        background: var(--dark);
        -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
        }
        
        ::-webkit-scrollbar-corner {
        background: var(--dark);
        }
        
        
        /********************************
                  DEFAULT
        *********************************/
        body{
        margin:0;
        overflow-x:hidden !important;
        font-family:var(--defaultfont);
        }
        
        a{
        text-decoration:none;
        color:blue;
        text-decoration: none;
        }
        
        a, button, input, select, p{
        outline:none !important;
        transition:0.5s;
        } 
        
        em{
        font-style:normal;
        color:var(--primary);
        }
        
        p{
        line-height:1.6em;
        font-size:14px;
        color:rgba(1,1,1,0.7);
        }
        
        img{
        max-width:100%;
        }
        
        figure{
        margin:0;
        padding:0;
        }
        
        fieldset{
        width:100%;
        border:0;
        padding:0;
        margin:0;
        }
        
        .title{
        font-family:var(--titlefont);
        }
        
        .btn1, .btn2{
        padding:1rem 2rem;
        border-radius:10px;
        text-align:center;
        border:0;
        }
        
        .btn1{
        background-color:var(--yellow);
        color:var(--white);
        }
        
        .btn1:hover{
        background-color:var(--darkyellow);
        }
        
        .btn2{
        background-color:var(--red);
        color:var(--white);
        }
        
        .btn2:hover{
        background-color:var(--darkred);
        }
        
        
        
        
        /********************************
                  HEADER
        *********************************/
        header{
        width:100%;
        display:flex;
        align-items:center;
        justify-content:center;
        background-size:cover;
        background-repeat:no-repeat;
        }
        
        header section{
        width:auto;
        padding:8rem 1rem;
        position:relative;
        color:var(--white);
        }
        
        header section:after{
        content:"";
        position:absolute;
        background-color:var(--yellow);
        height:4px;
        width:100px;
        left:50%;
        transform:translate(-50%, 0);
        }
        
        header section .title{
        font-size:3em;
        line-height:0;
        }
        
        header section span{
        position:absolute;
        bottom:0;
        left:50%;
        transform:translate(-50%, 0);
        background-color:var(--yellow);
        padding:10px 20px;
        border-radius:10px 10px 0 0;
        white-space:nowrap;
        }
        
        header a:hover{
        color:var(--dark);
        }
        
        header .active{
        color:var(--dark);
        pointer-events:none;
        }
        
        @media (max-width:1000px){
        header section .title{
        font-size:1.5em;
        line-height:0.8;
        }
        }
        
        
        
        
        
        
        /********************************
                BLOG CONTAINER
        *********************************/
        .blog_container{
        width:100%;
        display:flex;
        align-items:top;
        background-color:#f1f1f1;
        }
        
        /*BLOG LEFT CONTENT*/
        .blog_content{
        padding:2rem;
        width:100%;
        }
        
        .blog_content .load-btn{
        display:block;
        width:150px;
        margin:5vh auto;
        }
        
        .left_content{
        display:flex;
        align-items:top;
        justify-content: space-between;
        flex-wrap:wrap;
        column-count: 2;
        gap: 20px 10px;
        flex:0 0 70%;
        }
        
        .right_content{
        flex:0 0 30%;
        }
        
        .blog_card{
        width:100%;
        flex:0 0 48.5%;
        overflow:hidden;
        background-color:var(--white);
        }
        
        .blog_card:nth-child(1){
        flex:0 0 100%;
        }
        
        .blog_card .figure{
        display:block;
        width:100%;
        height:200px;
        position:relative;
        overflow:hidden;
        }
        
        .blog_card:nth-child(1) .figure{
        height:300px;
        }
        
        .blog_card .figure img{
        width:100%;
        height:100%;
        object-fit:cover;
        transition:0.5s;
        }
        
        .blog_card .tag{
        padding:5px 10px;
        background-color:var(--yellow);
        color:var(--white);
        position:absolute;
        right:1%;
        top:3%;
        font-size:12px;
        }
        
        .blog_card section{
        padding:1rem;
        position:relative;
        background-color:var(--white);
        }
        
        .blog_card section .title{
        font-weight:600;
        font-size:18px;
        color:var(--dark);
        width:auto;
        }
        
        .blog_card section a:hover{
        color:var(--yellow);
        }
        
        .blog_card:hover > .figure img{
        transform:scale(1.1);
        }
        
        .share_icon{
        position:absolute;
        bottom:-30px;
        left:10px;
        background-color:var(--red);
        color:var(--white);
        display:flex;
        align-items:center;
        padding-right:5px;
        font-size:13px;
        cursor:pointer;
        transition:0.5s;
        }
        
        .share_icon .fa{
        padding:5px;
        background-color:var(--darkred);
        margin-right:10px;
        }
        
        .blog_card section img{
        width:30%;
        margin-right:20px;
        object-fit:cover;
        border:5px solid rgba(1,1,1,0.1);
        }
        
        .blog_card section img:nth-child(even){
        float:left;
        }
        
        .blog_card section img:nth-child(odd){
        float:right;
        }
        
        
        
        
        /*BLOG RIGHT CONTENT*/
        .columns{
        display:block;
        margin-bottom:4vh;
        background-color:var(--white);
        }
        
        .columns section{
        padding:1rem;
        }
        
        .columns .title{
        background-color:#1c443c;
        color:var(--white);
        padding:1rem;
        text-align:left;
        width:100%;
        display:block;
        transition:0.2s;
        border-left:0px solid var(--dark);
        }
        
        .columns:hover > .title{
        border-left:5px solid var(--dark);
        }
        
        .columns .title a{
        float:right;
        }
        
        .columns .title a:hover{
        color:var(--dark);
        }
        
        .search form{
        width:100%;
        display:flex;
        align-items:center;
        }
        
        .search fieldset:nth-child(2){
        width:10%;
        }
        
        .search form input{
        border:1px solid rgba(1,1,1,0.1);
        padding:1rem;
        width:100%;
        font-weight:600;
        color:rgba(1,1,1,0.5);
        }
        
        .search .btn1{
        border:1px solid var(--yellow);
        border-radius:0;
        }
        
        
        
        /*BOOKS*/
        .books .cards {
        position: relative;
        width: 100%;
        height:46vh;
        overflow: hidden;
        border-radius: 5px;
        background-color:#f1f1f1;
        }
        
        .books .cards::after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        z-index: 900;
        display: block;
        width: 100%;
        height: 100%;
        }
        
        .books .card_part {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 7;
        display: flex;
        align-items: center;
        width: 100%;
        height: 100%;
        background-size:100% 100%;
        background-position:center;
        transform: translateX( 700px );
        background-repeat:no-repeat;
        animation: opaqTransition 28s cubic-bezier(0, 0, 0, 0.97) infinite;
        background-color:#f1f1f1;
        }
        
        .books .card_part.card_part-two {
        z-index: 6;
        animation-delay: 7s;
        background-repeat:no-repeat;
        }
        
        .books .card_part.card_part-three {
        z-index: 5;
        animation-delay: 14s;
        background-repeat:no-repeat;
        }
        
        .books .card_part.card_part-four {
        z-index: 4;
        animation-delay: 21s;
        background-repeat:no-repeat;
        }
        
        @keyframes opaqTransition {
        3% { transform: translateX( 0 ); }
        25% { transform: translateX( 0 ); }
        28% { transform: translateX( -700px ); }
        100% { transform: translateX( -700px ); }
        }
        
        
        
        
        /*CATEGORIES*/
        .categories a{
        display:inline-block;
        padding:0.2rem 1rem;
        border-radius:40px;
        background-color:rgba(1,1,1,0.3);
        margin:5px 3px;
        font-size:12px;
        white-space:nowrap;
        color:var(--white);
        }
        
        .categories a:hover{
        background-color:var(--dark);
        }
        
        
        /*POSTS*/
        .posts a{
        display:flex;
        align-items:center;
        margin:0.4rem 0;
        }
        
        .posts a img{
        width:100px;
        margin-right:10px;
        }
        
        .posts a:hover > p{
        color:var(--black);
        }
        
        
        
        /*COMMENTS*/
        .comments{
        position:relative;
        overflow:hidden;
        max-height:60vh;
        }
        
        .marquee2 {
        position: relative;
        overflow:hidden;
        line-height:1.6em;
        }
        
        .marquee2 p{
        border-bottom:1px solid rgba(1,1,1,0.1);
        position:relative;
        padding:0.4rem 0;
        }
        
        .marquee2 p:before{
        content: "\f10d";
        font-family:"FontAwesome";
        margin-right:5px;
        position:relative;
        top:-5px;
        }
        
        @keyframes marquee1 {
        0% {
        top: 10%;
        }
        100% {
        top: -100%;
        }
        }
        
        
        /*SOCIAL MEDIA*/
        .social_icons{
        display:flex;
        align-items:center;
        justify-content:center;
        column-gap: 15px;
        background-color:transparent;
        }
        
        .social_icons .fa{
        padding:7px 13px;
        background-color:#f1f1f1;
        color:var(--white);
        transition:0.2s;
        }
        
        .social_icons a:hover > .fa{
        transform:scale(1.1);
        }
        
        .social_icons .fa-facebook{
        background-color:#3b5998;
        }
        
        .social_icons .fa-instagram{
        background-color:#fb3958;
        }
        
        .social_icons .fa-youtube{
        background-color:#c4302b;
        }
        
        .social_icons .fa-whatsapp{
        background-color:#25d366;
        }
        
        .social_icons .fa-telegram{
        background-color:#3399ff;
        }
        
        
        @media (max-width:1000px){
        .blog_container{
        flex-wrap:wrap;
        }
        .blog_content{
        padding:0;
        order:2;
        }
        .left_content{
        flex:0 0 100%;
        order:2;
        padding:1rem;
        }
        .right_content{
        flex:0 0 100%;
        order:1;
        padding:1rem;
        }
        .books,.posts, .comments, .categories{
        display:inline-block;
        width:47%;
        margin:1.3%;
        margin-bottom:0;
        vertical-align:top;
        height:63vh;
        }
        .posts{
        overflow-y:auto;
        }
        .right_content{
        flex:0 0 100%;
        }
        }
        
        @media (max-width:740px){
        .blog_card{
        flex:0 0 100%;
        }
        .posts, .comments, .books, .categories{
        width:100%;
        margin:0;
        height:auto;
        margin-bottom:4vh;
        }
        }
        
        
        
        
        
        
        /*REMOVE THIS*/
        .credits{
        position:fixed;
        right:0;
        bottom:2%;
        background-color:#1e1e1e;
        padding:0.5rem;
        font-size:12px;
        z-index:999;
        color:rgba(255,255,255,0.7);
        }
        
        .credits a{
        color:rgba(255,255,255,0.7);
        }
        
        .credits a:hover{
        color:white;
        }
        
        .credits .btn0{
        background-color:white;
        color:#000;
        padding:5px;
        border-radius:5px;
        border:0;
        display:block;
        margin:1vh auto;
        width:100px;
        text-align:Center;
        }
        
        .credits .btn0:hover{
        color:black;
        background-color:#b8bca7;
        }
        
        .inicons{
        background-color: aquamarine;
      padding: 5px 0px 0px 10px;
      height: 40px;
      width: 40px;
    
        }