body { background-color: #040E1E; height: 100%; overflow: hidden; }
.header-fixed .wrapper { padding: 0px; }
.logo { display: inline-block; width: 75px; }
#main-title { font-size: 2.9rem; color: #fff; }
#map-title { font-size: 2.9rem; color: #fff; text-align: center; margin-top: 12px; }
#totals-title { font-size: 2rem }
#live-feeds { min-height: 790px; overflow: hidden; padding-bottom: 0; }
.country-flag { width: 40px; min-width: 40px; max-width: 40px; display: inline-block; }
.new-converts-list a { font-size: 1.6rem !important; }
.new-converts-list span { font-size: 1.4rem !important; }
.total-values div span.total-num { font-size: 1.8rem !important; cursor: pointer; }
.total-values div span.text-label { font-size: 1.5rem !important }

#live-feeds > .card-body { padding: 1.75rem 1rem 0.5rem; }
.new-converts-list > div { padding: 0 1.25rem; }

.new-converts-list .highlight-me { background-color: #627BC1; transition: background-color 500ms; }
.new-converts-list .highlight-me a { color: #FFF !important; transition: color 500ms; }
.new-converts-list .highlight-me span { color: #FFF !important; transition: color 500ms; }
.new-converts-list .highlight-me.remove-bg { background-color: #FFF; transition: background-color 500ms; }
.new-converts-list .highlight-me.remove-bg a { color: #3f4254 !important; transition: color 500ms; }
.new-converts-list .highlight-me.remove-bg span { color: #b5b5c3 !important; transition: color 500ms; }

#map {
    width: 100%;
    height: 100%;
}

@media (max-width: 1800px) {
    body { overflow: auto; }
    .logo { width: 70px; }

    #main-title { font-size: 2.6rem; }
    #map-title { font-size: 2.6rem; }

    .new-converts-list a { font-size: 1.55rem !important; }
    .new-converts-list span { font-size: 1.35rem !important; }

    .total-values div span.total-num { font-size: 1.6rem !important; }
    .total-values div span.text-label { font-size: 1.3rem !important; }
}

@media (max-width: 1600px) {
    .logo { width: 65px; }

    #main-title { font-size: 2.4rem; }
    #map-title { font-size: 2.4rem; }

    .new-converts-list a { font-size: 1.45rem !important; }
    .new-converts-list span { font-size: 1.3rem !important; }

    .total-values div span.total-num { font-size: 1.45rem !important; }
    .total-values div span.text-label { font-size: 1.2rem !important; }
}

@media (max-width: 1440px) {
    .logo { width: 55px; }

    #main-title { font-size: 2rem; }
    #map-title { font-size: 2rem; }
    #live-feeds { min-height: 450px; }

    .new-converts-list a { font-size: 1.3rem !important; }
    .new-converts-list span { font-size: 1.2rem !important; }

    .total-values div span.total-num { font-size: 1.3rem !important; }
    .total-values div span.text-label { font-size: 1.2rem !important; }

    #subtotal .card-body {
        padding: 1.5rem;
    }
}

@media (max-width: 1240px) {
    #kt_wrapper > .content { padding: 10px 0; }
    .logo { width: 45px; }

    #main-title { font-size: 1.7rem; }
    #map-title { font-size: 1.7rem; }

    .new-converts-list > div { padding: 0; }

    .country-flag {
        width: 30px;
        min-width: 30px;
    }
    .new-converts-list span.bullet.bullet-bar {
        margin: 0 1rem !important;
    }

    .new-converts-list a { font-size: 1.1rem !important; }
    .new-converts-list span { font-size: 1rem !important; }

    .total-values div span.total-num { font-size: 1rem !important; }
    .total-values div span.text-label { font-size: 0.9rem !important; }

    #subtotal .card-body {
        padding: 1rem;
    }
    #subtotal .card-body .total-values .row > .col-6, #subtotal .card-body .total-values .row > .col-0 {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }
    .new-converts-list > div.d-flex:nth-child(8){
        display:none !important;
    }
}

@media (max-width: 1080px) {
    .new-converts-list a { font-size: 1rem !important; }
    .new-converts-list span { font-size: 1rem !important; }
}

@media (max-width: 1024.98px) {
    body { overflow: hidden; }
    #kt_footer { display: none !important; }
    #main-title, #map-title { display: none; }
    .container-fluid > .row > .col-lg-6 { 
        flex: 0 0 100%;
        max-width: 100%;
    }
    .header-mobile { 
        display: flex;
        height: 60px;
        min-height: 60px;
        background-color: rgb(4 14 30 / 80%);
        justify-content: center;
        z-index: 20;
        margin-bottom: 0 !important;
        margin-left: 15px;
        margin-right: 15px;
        border: 1px solid #ebedf3;
        border-top: none;
        border-radius: 0 0 .42rem .42rem;
    }
    .mobile-logo { 
        max-width: unset;
        width: 50px;
    }
    #mobile-main-title { 
        font-size: 1.2rem; 
        color: #FFF; 
        margin-top: 0.4rem !important; 
        display: none;
    }
    #mobile-main-title-tablet {
        font-size: 1.75rem; 
        color: #FFF; 
        margin-top: 0.4rem !important; 
    }
    .country-flag {
        width: 30px;
        min-width: 30px;
    }
    .new-converts-list span.bullet.bullet-bar {
        margin: 0 1rem !important;
    }

    #map {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 1px;
        z-index: 10;
    }

    #subtotal {
        z-index: 15;
        background: rgba(25, 25, 25, .7);
    }

    #subtotal .card-body {
        padding: 1rem;
    }

    .total-values div span.total-num {
        color: #FFF !important;
        font-size: 1.4rem !important;
        font-weight: normal;
    }
    .total-values div span.text-label {
        color: #FFF !important;
        font-size: 1.2rem !important;
    }

    #live-feeds { 
        z-index: 20;
        background: rgba(25, 25, 25, .7);
        min-height: unset;
        max-height: 370px;
        height: 370px;
        overflow: scroll;
        position: fixed;
        bottom: 20px;
        left: 0;
        right: 0;
        margin: 0 15px;
    }
    #live-feeds .card-body {
        padding: 0.8rem;
    }

    .new-converts-list > div {
        padding: 0 0.75rem;
    }

    .new-converts-list a { font-size: 1.1rem !important; color: #FFF !important; }
    .new-converts-list span { font-size: 1.1rem !important; }

    .new-converts-list .highlight-me.remove-bg { background-color: transparent; transition: background-color 500ms; }
    .new-converts-list .highlight-me.remove-bg a { color: #FFF !important; transition: color 500ms; }
    .new-converts-list .highlight-me.remove-bg span { color: #b5b5c3 !important; transition: color 500ms; }
}

@media (max-width: 575px) and (orientation: portrait) {
    .header-mobile { 
        height: 40px;
        min-height: 45px;
        padding: 0 8px;
    }
    .mobile-logo { 
        width: 40px;
    }
    #mobile-main-title { 
        font-size: 1.1rem;
        display: block;
        margin-right: 0.5rem !important;
        margin-left: 0.5rem !important;
    }
    #mobile-main-title-tablet {
        display: none;
    }

    .total-values div span.total-num {
        color: #FFF !important;
        font-size: 1.2rem !important;
        font-weight: normal;
    }
    .total-values div span.text-label {
        color: #FFF !important;
        font-size: 1rem !important;
    }
    .daily-convert, .daily-convert-sub {
        display: none !important;
    }

    #live-feeds { 
        max-height: 240px;
        height: 240px;
    }
}

@media (max-width: 360px) and (orientation: portrait) {
    #mobile-main-title { 
        font-size: 1.1rem;
    }
}

@media (max-width: 340px) and (orientation: portrait) {
    #mobile-main-title { 
        font-size: 1rem;
    }
}