﻿/* Container */
.cards-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    grid-template-rows: repeat(4, auto);
    gap: 10px;
}

/* Subgrid */
.gridBox {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 4;
    padding: 15px;
}


/* Tablets Responsiveness (700px to 900px) */
@media (max-width: 900px) and (min-width: 700px) {
    .cards-container {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        justify-items: center;
    }
}

/* Mobile Responsiveness */
@media (max-width: 699px) {
    .cards-container {
        grid-template-columns: 1fr;
        justify-items: center;
    }
}

/* Container */
.caards-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    grid-template-rows: repeat(3, auto);
    gap: 15px;
}

/* Subgrid */
.gridBoxCards {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 3;
    padding: 15px;
}

/* Tablets Responsiveness (700px to 900px) */
@media (max-width: 900px) and (min-width: 700px) {
    .caards-container {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        justify-items: center;
    }
}

/* Mobile Responsiveness */
@media (max-width: 699px) {
    .caards-container {
        grid-template-columns: 1fr;
        justify-items: center;
    }
}

/* Container */
.cards-containerhome {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    grid-template-rows: repeat(4, auto);
    gap: 10px;
}

/* Subgrid */
.gridBoxhome {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 4;
    padding: 15px;
}

.LineThemeFadeDiv {
    display: block;
    height: var(--Pl1);
    width: 94%;
    margin: var(--Pl3);
    background-image: linear-gradient(to right, rgba(255, 0, 0, 0), var(--CrTe), rgba(255, 0, 0, 0));
}

.CrNmHr, .CrNmHr a {
    transition: ease-in-out 0.3s;
}

    .CrNmHr:hover {
        transform: scale(1.03);
        background-color: violet;
        color: white;
    }

    .CrNmHr:hover a{
        color: white;
    }


/* Container */
.books-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    grid-template-rows: repeat(3, auto);
    gap: 30px;
}

/* Subgrid */
.bookBox {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 4;
    padding: 15px;
}


/* Tablets Responsiveness (700px to 900px) */
@media (max-width: 900px) and (min-width: 700px) {
    .books-container {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        grid-template-rows: repeat(2, auto);
        justify-items: center;
    }
}

/* Mobile Responsiveness */
@media (max-width: 699px) {
    .books-container {
        grid-template-columns: 1fr;
        justify-items: center;
    }
}

.CrBdTe30Sn90Lt75 {
    background-color: hsla( var(--CrTeH) 30% 90% / 0.75);
}
.CrBdTe10Sn90Lt50 {
    background-color: hsla( var(--CrTeH) 60% 97% / 0.97);
}

.JsHrDv {
    font-family: 'Barlow Condensed',sans-serif;
    background-color: #fff;
    color: #222;
    transition: .3s
}

.JsSeCr {
    color: #666;
}

.JsAeRwCr:nth-child(odd) {
    background-color: #f7e5ff !important;
}

.JsAeRwCr:nth-child(even) {
    background-color: white !important;
}

.JsHrDv:hover {
    background-color: #cc8ff0 !important
}

.CrBrJsDv {
    border-color: #f1eeeb !important;
    margin-top: -1px
}

.CrBdWe80Lt51 {
    background-color: hsl(var(--CrWeH) 0% 80% / 0.31);
}