/* MyInstantAds homepage member showcase */

#mia-member-spotlight,
#mia-community-ads,
#mia-member-spotlight *,
#mia-community-ads * {
    box-sizing:border-box;
}

.mia-member-spotlight,
.mia-community-ads {
    width:min(1160px,calc(100% - 28px));
    margin:22px auto;
    font-family:Arial,Helvetica,sans-serif;
}

.mia-member-spotlight {
    padding:20px;
    border:3px solid #05090d;
    box-shadow:8px 8px 0 rgba(0,0,0,.32);
    background:
        radial-gradient(circle at 100% 0,
            rgba(255,221,0,.18),transparent 28%),
        linear-gradient(135deg,#087ab4,#0e9dda 58%,#0873a8);
}

.mia-spotlight-kicker,
.mia-community-head > span,
.mia-sponsor-ads header span,
.mia-community-label {
    color:#ffe229;
    font-size:11px;
    line-height:1.2;
    font-weight:1000;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.mia-spotlight-grid {
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);
    gap:18px;
    margin-top:10px;
}

.mia-member-card,
.mia-sponsor-ads {
    border:3px solid #05090d;
    border-radius:8px;
    background:#fffdf1;
    color:#091018;
    box-shadow:6px 6px 0 rgba(0,0,0,.28);
}

.mia-member-card {
    padding:20px;
}

.mia-member-top {
    display:grid;
    grid-template-columns:112px minmax(0,1fr);
    gap:17px;
    align-items:center;
}

.mia-member-photo {
    display:block;
    width:112px;
    height:112px;
    overflow:hidden;
    border:4px solid #05090d;
    border-radius:50%;
    background:#fff;
    box-shadow:5px 5px 0 #ffd91a;
}

.mia-member-photo img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
}

.mia-plan-badge {
    display:inline-flex;
    padding:5px 8px;
    border:2px solid #05090d;
    background:#a4ff13;
    font-size:10px;
    font-weight:1000;
    text-transform:uppercase;
}

.mia-member-identity h2 {
    margin:8px 0 3px;
    color:#091018;
    font-size:31px;
    line-height:1;
    font-weight:1000;
}

.mia-member-identity h2 span {
    color:#078bc9;
}

.mia-member-handle {
    color:#55616a;
    font-size:13px;
    font-weight:800;
}

.mia-about {
    margin:18px 0 14px;
    color:#333d45;
    font-size:14px;
    line-height:1.55;
}

.mia-social-row {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin:0 0 14px;
}

.mia-social-row a {
    display:inline-flex;
    width:38px;
    height:38px;
    align-items:center;
    justify-content:center;
    border:2px solid #05090d;
    border-radius:50%;
    background:#0a9bd9;
    color:#fff;
    font-size:11px;
    font-weight:1000;
    text-decoration:none;
    box-shadow:2px 2px 0 #05090d;
}

.mia-social-row a:hover {
    background:#ffd91a;
    color:#091018;
}

.mia-member-links {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.mia-member-links a {
    display:flex;
    min-height:43px;
    padding:9px 11px;
    align-items:center;
    gap:7px;
    border:2px solid #0b1a24;
    border-radius:6px;
    background:#eefaff;
    color:#075a83;
    font-size:12px;
    font-weight:900;
    text-decoration:none;
    overflow-wrap:anywhere;
}

.mia-member-links a span {
    color:#ff7518;
    font-size:17px;
}

.mia-member-actions {
    display:grid;
    grid-template-columns:1fr 1.35fr;
    gap:8px;
    margin-top:15px;
}

.mia-show-btn {
    display:flex;
    min-height:44px;
    padding:9px 11px;
    align-items:center;
    justify-content:center;
    border:3px solid #05090d;
    border-radius:6px;
    font-size:11px;
    font-weight:1000;
    text-align:center;
    text-decoration:none;
    box-shadow:3px 3px 0 rgba(0,0,0,.24);
}

.mia-show-btn-dark {
    background:#fff;
    color:#0a1117;
}

.mia-show-btn-yellow {
    background:#ffd91a;
    color:#091018;
}

.mia-sponsor-ads {
    padding:17px;
}

.mia-sponsor-ads header {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:13px;
}

.mia-sponsor-ads header span {
    color:#078bc9;
}

.mia-sponsor-ads h2 {
    margin:4px 0 0;
    color:#091018;
    font-size:25px;
    font-weight:1000;
}

.mia-ad-live,
.mia-ad-paused {
    display:inline-flex;
    padding:6px 8px;
    border:2px solid #05090d;
    font-size:10px;
    font-weight:1000;
    white-space:nowrap;
}

.mia-ad-live {
    background:#a4ff13;
    color:#0b3010;
}

.mia-ad-paused {
    background:#ffdb61;
    color:#4a2400;
}

.mia-sponsor-banners,
.mia-community-banners {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}

.mia-live-banner {
    min-width:0;
    padding:9px;
    border:2px solid #05090d;
    border-radius:5px;
    background:#fff;
    text-align:center;
}

.mia-live-banner a {
    display:flex;
    min-height:62px;
    align-items:center;
    justify-content:center;
}

.mia-live-banner img {
    display:block;
    width:auto;
    height:auto;
    max-width:100%;
    max-height:70px;
    object-fit:contain;
}

.mia-live-banner small {
    display:block;
    margin-top:6px;
    color:#68737c;
    font-size:10px;
    font-weight:800;
}

.mia-sponsor-texts {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin-top:10px;
}

.mia-live-text {
    display:flex;
    min-height:66px;
    padding:11px;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    border:2px solid #05090d;
    border-radius:5px;
    background:#fffce9;
    color:#101820;
    text-decoration:none;
}

.mia-live-text:hover {
    background:#fff1a9;
}

.mia-live-text strong {
    display:block;
    font-size:13px;
    line-height:1.25;
}

.mia-live-text span {
    display:block;
    color:#078bc9;
    font-size:10px;
    font-weight:900;
}

.mia-sponsor-note {
    margin-top:11px;
    padding:8px 10px;
    border-left:5px solid #ffd91a;
    background:#eefaff;
    color:#53616b;
    font-size:11px;
    line-height:1.45;
}

.mia-showcase-empty {
    grid-column:1/-1;
    min-height:62px;
    padding:15px;
    border:2px dashed #6d7c86;
    border-radius:5px;
    color:#6c7780;
    background:#f6fbfd;
    font-size:12px;
    text-align:center;
}

.mia-community-ads {
    padding:26px 18px;
    border:3px solid #05090d;
    background:
        radial-gradient(circle at 0 100%,
            rgba(0,171,235,.18),transparent 27%),
        #07111a;
    box-shadow:8px 8px 0 rgba(0,0,0,.28);
}

.mia-community-head {
    margin:0 auto 20px;
    text-align:center;
}

.mia-community-head h2 {
    margin:5px 0 5px;
    color:#fff;
    font-size:33px;
    line-height:1.05;
    font-weight:1000;
}

.mia-community-head p {
    width:min(760px,100%);
    margin:0 auto;
    color:#b9cbd8;
    font-size:13px;
    line-height:1.5;
}

.mia-community-label {
    margin:18px 0 8px;
}

.mia-community-banners {
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.mia-community-texts {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
}

.mia-community-ads .mia-live-banner {
    border-color:#17232c;
    background:#fff;
}

.mia-community-ads .mia-live-text {
    border-color:#17232c;
}

.mia-community-foot {
    margin-top:15px;
    color:#78909f;
    font-size:10px;
    text-align:center;
}

@media (max-width:850px) {
    .mia-spotlight-grid {
        grid-template-columns:1fr;
    }

    .mia-sponsor-texts,
    .mia-community-texts {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:600px) {
    .mia-member-spotlight,
    .mia-community-ads {
        width:calc(100% - 14px);
        margin:10px auto;
    }

    .mia-member-spotlight {
        padding:10px;
    }

    .mia-member-card,
    .mia-sponsor-ads {
        padding:13px;
    }

    .mia-member-top {
        grid-template-columns:86px minmax(0,1fr);
        gap:12px;
    }

    .mia-member-photo {
        width:86px;
        height:86px;
    }

    .mia-member-identity h2 {
        font-size:25px;
    }

    .mia-member-links,
    .mia-member-actions,
    .mia-sponsor-banners,
    .mia-community-banners,
    .mia-sponsor-texts,
    .mia-community-texts {
        grid-template-columns:1fr;
    }

    .mia-community-head h2 {
        font-size:27px;
    }
}

/* MIA_ABOVE_FOLD_COMMUNITY_CSS_V1 */

.mia-above-community {
    margin-top:14px;
    padding-top:13px;
    border-top:3px solid #0a1117;
}

.mia-above-community-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:9px;
}

.mia-above-community-head span {
    color:#078bc9;
    font-size:11px;
    font-weight:1000;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.mia-above-community-head small {
    color:#6c7880;
    font-size:9px;
    font-weight:800;
}

.mia-above-community-banners {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
}

.mia-above-community-banners .mia-live-banner {
    padding:7px;
}

.mia-above-community-banners .mia-live-banner a {
    min-height:55px;
}

.mia-above-community-banners .mia-live-banner img {
    max-height:60px;
}

.mia-above-community-banners .mia-live-banner small {
    margin-top:4px;
    font-size:9px;
}

.mia-above-community-texts {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin-top:8px;
}

.mia-above-community-texts .mia-live-text {
    min-height:54px;
    padding:8px 9px;
}

.mia-above-community-texts .mia-live-text strong {
    font-size:11px;
    line-height:1.2;
}

.mia-above-community-texts .mia-live-text span {
    font-size:9px;
}

@media(max-width:720px) {
    .mia-above-community-banners {
        grid-template-columns:1fr;
    }

    .mia-above-community-texts {
        grid-template-columns:1fr;
    }

    .mia-above-community-head {
        align-items:flex-start;
        flex-direction:column;
    }
}
