@CHARSET "UTF-8";
@font-face {
    font-family: Amble;
    src: url("fonts/Amble/Amble-Regular.ttf");
}

@font-face {
    font-family: Nevis;
    src: url("fonts/Nevis/nevis.ttf");
}

@font-face {
    font-family: Vollkorn;
    src: url("fonts/Vollkorn/Vollkorn-Regular.ttf");
}

body {background-image: url("img/BeautifulGreenGrassTexturePreview_thumb.jpg"); font-family: Nevis;}

p {font-family: Vollkorn; text-align: justify;}
#mainbox {background-color: rgba(225,255,225,0.8); width:740px; margin:30px; padding:20px 20px 120px 20px;}
.bigtable {min-width: 730px;}
.bigrow {clear: both; border-top: solid 1px; padding-top: 8px;}
.header {text-align: center;}
.header.cell {height: 40px;}
.header.name {text-align: left;}
.cell {float: left; height: 55px;}
.cell.points {width: 40px; text-align: right;}
.name {width:120px;}
.guess {}
.quarter { width: 160px;}
.semi { width: 180px; padding: 0 15px 0 25px;}
.silver {width: 60px; padding: 0 15px;}
.gold {width: 60px; padding: 0 15px;}
.team{ width: 35px;height: 20px; background-size: 35px 20px; margin: 2px; float:left;}
.semi .team{ width: 40px;height: 24px; background-size: 40px 24px; margin: 11px 2px; float:left;}
.silver .team{ width: 50px;height: 30px; background-size: 50px 30px; margin: 5px 2px; float:left;}
.gold .team{ width: 60px;height: 37px;background-size: 60px 37px;  margin: 0 2px; float:left;}
.croatia {background-image: url("img/CROA0001.GIF") }
.czech {background-image: url("img/CZEC0001.GIF") }
.denmark {background-image: url("img/DENM0001.GIF") }
.france {background-image: url("img/FRAN0001.GIF") }
.germany {background-image: url("img/GERM0001.GIF") }
.greece {background-image: url("img/GREC0001.GIF") }
.ireland {background-image: url("img/IREL0001.GIF") }
.italy {background-image: url("img/ITAL0001.GIF") }
.netherlands {background-image: url("img/NETH0001.GIF") }
.poland {background-image: url("img/POLA0001.GIF") }
.portugal {background-image: url("img/PORT0001.GIF") }
.russia {background-image: url("img/RUSS0001.GIF") }
.spain {background-image: url("img/SPAN0001.GIF") }
.sweden {background-image: url("img/SWDN0001.GIF") }
.ukraine {background-image: url("img/UKRN0001.GIF") }
.england {background-image: url("img/UNKG0100.GIF") }

.team.highlighted .container {background-color: #444; opacity: 0.7; }

.team .container {background-image: url("img/container_plain.png"); background-size: 100% 100%; width: 100%; height: 100%;}

.team .outoft {background-image: url("img/crossed_out.png"); background-size: 100% 100%; width: 100%; height: 100%;}
.team .outinq {background-image: url("img/X_q.png"); background-size: 100% 100%; width: 100%; height: 100%;}
.team .outins {background-image: url("img/X_s.png"); background-size: 100% 100%; width: 100%; height: 100%;}
.team .finish-silver {background-image: url("img/silver.png"); background-size: 100% 100%; width: 100%; height: 100%;}
.team .finish-gold {background-image: url("img/gold.png"); background-size: 100% 100%; width: 100%; height: 100%;}

#hoverbubble {width: 100px; height: 70px; overflow:hidden; position: absolute; background: #ffffe0; border: solid 1px #daa520;}
#hoverbubble .bubbleflag img {width:50px;height:28px;float:left; margin-right: 4px;}
#hoverbubble h4 {margin:4px;}
#hoverbubble .bubbleblurb {font-family: Vollkorn; font-size: 9pt;}

#flagbox {clear: both;padding-top: 20px;}
#flagbox div h4{margin: 2px;text-align: center;}
#flagbox>div {float:left; padding: 10px;}
#flagbox>div:nth-child(odd) {background-color: rgba(100,100,100,0.3);}

.exclamation {background-image: url("img/flashing_exclamation_mark.gif"); background-size: 100% 100%; background-repeat: no-repeat; width: 20px; height: 20px;}