.bn-top-content {
    position: relative;
}

.bestnation-form {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    margin-bottom: 2em;
}

.bestnation-candidate {
    position: relative;
    margin-left: 1em;
    height: 100%;
    filter: drop-shadow(0.1em 0.1em 0.3em black);
    display: flex;
    flex-direction: column;
}

.bestnation-form .bestnation-candidate {
    cursor: pointer;
}

.bestnation-form .bestnation-candidate:hover {
    filter: drop-shadow(0.1em 0.1em 0.6em black);
}

.bestnation-vs {
    border-radius: 100%;
    display: inline-block;
    color: white;
    padding: 0.5em;
    font-size: 250%;
    font-weight: bold;
    background: linear-gradient( 45deg , #447c48, #55d685);
    filter: drop-shadow(2px 2px 0.1em #1f4c22);
    transform: rotate(-15deg);
    margin: -0.3em -0.6em -0.3em -0.3em;
    position: relative;
    z-index: 5;
}

.bn-upper {
}

.bn-mid, .bn-lower {
    position: relative;
    z-index: 2;
}

.bn-topline {
    display: flex;
}

.bn-upper #badge_rack {
    position: relative;
    display: block;
    margin-top: 1em;
    min-height: 1em;
}

.bn-upper .badge {
    margin-left: 1em;
}

.bn-upper #wabadges {
    position: relative;
}

.bn-flag {
    position: relative;
    left: -1em;
    top: 1em;
    z-index: 3;
    margin-bottom: 1em;
    filter: drop-shadow(0 0 1em black);
}

.bn-flag img {
    min-width: 13em; 
    min-height: 10em;
    max-height: 15em;
}

.bn-name {
    position: relative;
    z-index: 3;
    margin-left: 1em;
    color: white;
    font-family: Georgia,Garamond,'Times New Roman',Times,serif;
    text-shadow: 0.2em 0.2em 0.1em #000, 1px 1px 0.1em #000, -1px -1px 0.2em #000;
    filter: drop-shadow(0 0 0.2em black);
}

.bn-pretitle {
    font-size: 250%;
}

.bn-nname {
    font-size: 400%;
    line-height: 0.8;
}

.bn-nname a {
    color: white;
}

.bn-banners {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.bn-banner {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    overflow:hidden;
}

.bn-banner-image {
    background-size: cover;
    width: 100%;
    height: 100%;
    box-shadow: 0 0 6em black inset;
}

.bn-banner-1 {
    clip-path: polygon(100% 50%, 0% 100%, 100% 100%);
}

.bn-banner-2 {
    clip-path: polygon(0 0, 0 50%, 100% 0);
}

.bn-mid .trophyline {
    padding-left: 1em;
    min-height: 0;
}

.bn-mid #trophyselectors, .bn-mid .trophysection {
    display: none;
}

.bn-topbox {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}


.bn-lower {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    margin-top: auto;
    padding-top: 1em;
}

.bn-lower:before {
    content: '';
    filter: blur(1.2em);
    background: white;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    clip-path: polygon(0 -50%, 100% -50%, 100% 100%, 0% 100%);
}

.bn-lower > div {
    position: relative;
}

.bn-slogan {
    position: relative;
    margin: 0.5em 2em 0.5em 0;
    padding: 0.5em 1.0em;
    align-self: flex-end;
    background: rgba(0, 0, 0, 0.65);
    color: white;
    font-family: Garamond,Georgia,serif;
    font-size: 200%;
    max-width: 60%;
    text-align: center;
    font-style: italic;
}

.bn-slogan:before { content: "\201C"; position: absolute; left: 0; top: 0; opacity: 0.65;}
.bn-slogan:after { content: "\201D"; position: absolute; right: 0.1em; top: 0; opacity: 0.65;}

.bn-govtype {
    color: #444;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: -1px;
    padding: 0.1em 0.2em;
    border-top: 1px dashed gray;
    border-bottom: 1px dashed gray;
}

.bn-population {
    color: #b73a3a;
}

.bn-gdp {
    color: #9c27b0;
}

.bn-dispatches {
    color: #3a69b7;
}

.bn-population, .bn-gdp, .bn-dispatches {
    font-weight: bold;
    letter-spacing: 1px;
}

.bn-population .pop-units, .bn-gdp .pop-units {
    margin-right: 0.5em;
}

.bn-population i.icon-male:before { margin-left: -0.5em; }
.bn-gdp i.icon-industrial-building:before { margin-left: -0.2em; }

.bn-rights .newmainlinebubble {
    min-width: 7em;
}

.bn_voting_form, .bn_view_nations {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 1em 0;
}

.bn_voting_form > div, .bn_view_nations > div {
    text-align: center;
}

.bn_voting_form button {
    font-family: 'Special Elite','Courier 10 Point','Courier New',cursive,serif;
    text-align: center;
    margin: 1em 4em;
    font-size: 150%;
    font-weight: bold;
    min-width: 30vw;
}

.bn_voting_discard {
    text-align: center;
    margin: 1em 0;
}

.bn_voting_discard button {
    font-weight: normal;
    font-size: 100%;
    color: #555;
    background: none;
    border: 1px solid #888;
    padding: 0.5em 2.5em;
    cursor: pointer;
}

.bestnation_ticker { display:block; color:white; font-size:90%; padding-top:2px; padding-bottom:2px; padding-left:2px; width:100%; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; text-align:center; background: linear-gradient(to bottom, rgb(76 188 113) 0%,rgb(46 89 53) 100%); }

.bestnation_ticker a:link, .bestnation_ticker a:visited { color:white; }

.bestnation_ticker .rank { background:#EEE; border-radius:1em; color:#b55757; padding:0 3px; font-weight:bold; }

.bn-leaderboard-link {
    position: absolute;
    top: 1em;
    right: 1em;
}

.bn-leaderboard-link .button {
    font-size: 140%;	
}

.bn-leaderboard {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.bn-leaderboard-entry {
    display: flex;
    align-items: center;
    margin: 1.5em;
    font-size: 50%;
    max-width: 60em;
}

.bn-leaderboard-entry-1 {
    font-size: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
}

.bn-leaderboard-entry-2, .bn-leaderboard-entry-3, .bn-leaderboard-entry-4, .bn-leaderboard-entry-5 {
}

.bn-leaderboard-entry .bn-upper {
    min-height: 0;
}

.bn-leaderboard-entry .newmainlinebubbletop {
    font-size: 100%;
    line-height: 1.5;
}

.bn-leaderboard-entry .trophy {
    max-width: 4em;
}

.bn-leaderboard-rank {
    color: #996;
    font-weight: bold;
    font-size: 400%;
    font-family: Garamond,Georgia,serif;
}

.bn-nationsummary {
    font-family: Georgia,Garamond,Times New Roman,serif;
    font-size: 133%;
}

@media only screen and (max-width: 1200px) {
    .bestnation-form {
	grid-template-columns: 1fr;
    }

    .bn_voting_form button {
	height: 100%;
	margin: 0;
    }

    .bn-upper {
	min-height: 0;
    }

    .bestnation-vs {
	justify-self: center;
    }

    .bn-pretitle {
	font-size: 130%;
    }

    .bn-nname {
	font-size: 250%;
    }

    .bn-flag img {
	min-height: 7em;
	max-height: 10em;
    }

    .bn-slogan {
	font-size: 110%;
    }

    .bn-leaderboard-link {
	top: -0.5em;
	right: -1em;
    }

    .bn-leaderboard-link .button {
	font-size: 100%;
    }

    .bn-leaderboard {
	margin-left: -1em;
    }

    .bn-leaderboard-entry:not(.bn-leaderboard-entry-1) {
	font-size: 70%;
    }

    .bn-leaderboard-rank {
	margin-left: -0.2em;
	margin-right: -0.2em;
	font-size: 250%;
	letter-spacing: -0.1em;
    }
}