/* =========================
   Typography
========================= */

h2,
.h2 {
    font-size: 1.275rem;
}

h3,
.h3 {
    font-size: 1.245rem;
}

/* =========================
   Hide View Icons
========================= */

.fa-eye,
.icon-eye,
.bi-eye,
.fa.fa-eye {
    display: none !important;
}

/* =========================
   Remove Underline
========================= */

.blog a,
.article a,
.item-title a,
a:not([class]) {
    text-decoration: none !important;
}

/* =========================
   Article Info
========================= */

.article-info dd {
    padding: 0;
    display: inline-block;
    margin-right: 0.5em;
}
body.view-article .com-content-article.item-page .extravote{
    top:-4px !important;
}
/* =========================
   Header / Menu
========================= */

.container-header {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
        "top"
        "below"
        "logo"
        "nav";
}

/* topbar */

.container-header .container-topbar {
    grid-area: top;
    padding: .1em;
}

/* below top */

.container-header .container-below-top {
    grid-area: below;
    justify-content: flex-end;
}

/* logo */

.container-header .grid-child:has(.navbar-brand) {
    grid-area: logo;
}

/* nav */

.container-header .container-nav {
    grid-area: nav;
}

/* desktop */

@media (min-width: 991.98px) {

    .container-header {
        grid-template-columns:
            [full-start] minmax(0, 1fr)
            [main-start] repeat(4, minmax(0, 19.875rem))
            [main-end] minmax(0, 1fr)
            [full-end];

        grid-template-areas:
            ". logo nav nav nav .";

        gap: 0 1rem;

        z-index: 10;
        background-color: var(--cassiopeia-color-primary);
        background-image: linear-gradient(
            0deg,
            var(--cassiopeia-color-primary) 0%
        );

        position: relative;

        box-shadow: inset 0 5px 5px #112855;
    }

    .container-header:has(.container-below-top, .container-topbar) {
        grid-template-areas:
            ". top top below below ."
            ". logo nav nav nav .";
    }
}

/* =========================
   Article Box
========================= */

.com-content-article.item-page {
    background-color: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 0 12px rgba(17, 40, 85, 0.2);
}

/* =========================
   Download Button
========================= */

.download-btn {
    display: block;
    width: 100%;
    max-width: 300px;
    margin: 30px auto;
    background-color: #2c7be5;
    color: #fff;
    text-align: center;
    padding: 15px 20px;
    font-size: 1.2rem;
    border-radius: 8px;
    text-decoration: none;
    transition: .3s ease;
}

.download-btn:hover {
    background-color: #1a5fd0;
}

/* =========================
   Driver Info Box
========================= */

.driver-info {
    background: #f8f9fa;
    padding: 15px 20px;
    margin: 20px 0;
    border-left: 5px solid #2c7be5;
    border-radius: 5px;
    font-size: .95rem;
    line-height: 1.6;
}

/* =========================
   Heading
========================= */

.article-wrapper h1,
h1 {
    font-size: 1.6rem;
    font-weight: 700;
    color: #000;
    margin-bottom: 1.2rem;
}

.card-header h3 {
    font-size: 1.3rem;
    font-weight: 600;
    margin: 0;
    color: #2c3e50;
}

article h2 {
    font-size: 1.6rem;
    font-weight: 700;
    color: #222;
    margin-top: 1.5rem;
    margin-bottom: 1rem;
    text-align: left;
}

/* =========================
   Paragraph
========================= */

article p {
    font-size: 1rem;
    line-height: 1.6;
    color: #333;
    text-align: left;
}

/* =========================
   Table
========================= */

.table {
    width: 100% !important;
    max-width: 900px;
    margin: 1rem 0;
    border-collapse: collapse;
}

.table th,
.table td {
    padding: .75rem 1rem;
    vertical-align: middle;
    border: 1px solid #dee2e6;
    font-size: 1rem;
    color: #222;
}

.table thead th {
    background-color: #f8f9fa;
    font-weight: 600;
    color: #2c3e50;
    text-align: left;
}

/* =========================
   Responsive Images
========================= */

article img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 1.5rem auto;
}

/* =========================
   Blog Item
========================= */

.boxed .blog-item {
    box-shadow:
        0 0 2px #3339421a,
        0 2px 5px #33394214,
        0 5px 15px #33394214,
        inset 0 3px 0 #eaedf0;

    background-color: #fff;
}

/* =========================
   Image Left / Right
========================= */

.image-left .blog-item .item-image,
.image-right .blog-item .item-image {
    flex: 1 0 20%;
}

/* =========================
   Body
========================= */

body {
    font-family: var(--body-font-family);
    font-size: var(--body-font-size);
    font-weight: var(--body-font-weight);
    line-height: var(--body-line-height);
    color: var(--body-color);
    text-align: var(--body-text-align);
    background-color: #eaedf0;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    margin: 0;
}

/* =========================
   CLS Fix
========================= */

.none .item-image,
img.jch-lazyload,
.lazyframe {
    aspect-ratio: 4 / 3;
    display: block;
    width: 100%;
    height: auto;
    background: #fafafa;
}

.container-sidebar-right .card {
    min-height: 250px;
}

#n3tcc-wrapper {
    min-height: 120px;
}

/* =========================
   Back To Top
========================= */

#back-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    opacity: 0;
    transition: opacity .3s ease;
}

#back-top.visible {
    opacity: 1;
}
.container-banner {
    margin: 0 0 0rem;
    display: block;
}

.container-header .container-nav {
    padding-bottom: 0.2em;
}
.container-header .navbar-brand {
    padding-top: 0rem; */
    padding-bottom: 0rem; */

}
.py-2 {
    padding-top: .2rem !important;
    padding-bottom: .2rem !important;
}

.px-3 {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
}

.pagination {
    justify-content: flex-end;
}
.text-muted
Specificity: (0,1,0)
 {
    --text-opacity: 1;
    color: var(--secondary-color) !important;
}

ol, ul, dl {
    margin-top: 0;
    margin-bottom: 0rem;
}
.ads-center{
    display:flex;
    justify-content:center;
    align-items:center;
    margin:20px 0;
    overflow:hidden;
}