html,body { position:relative; height:100%; padding:0; margin:0; }
html,body,.highcharts-container { font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;}
#logobox img { transition:opacity 0.2s; }
#logobox img:hover { opacity:0.7;}
#footer { text-align:center; font-size:90%; }
#footer a:link, #footer a:visited { color: #0095c7; text-decoration:none; font-weight: bold; transition:all 0.25s;}
#footer a:hover { text-decoration:underline; background-color:#0095c7; color:white; }
#mblink { padding:12px; background-color:rgba(235,235,235,1);}
.menubuttons a { font-size:32px; }
.menubuttons button { padding: 4px 4px; font-size:22px; min-width:64px; vertical-align:middle; }
button, select { transition:color 0.5s ease-out, text-shadow 0.5s ease-out;}
button:not([disabled]):hover, select:hover, option:hover { text-shadow:4px 4px 1px #CCC; transition:none; color:#000;}
.menubuttons img { vertical-align:middle; margin-right:8px; }
.headerbuttons { float:right; color:gray; padding:0; height:64px;}
#headermenuopen { padding-top:4px; display:none; }
#headerfieldsets.mpopout { display:inline-block; }
button:disabled { color:gray;}
fieldset { border-radius:12px; border-width:6px; }
#squiggle-info { text-align: left; }
#squiggle-info fieldset { margin: 6px 12px 18px 12px;}
legend { font-size: 22px; color:gray; }
fieldset span { background-color:#3A3A32; padding:4px 9px; line-height:2em; font-weight:bold; white-space:nowrap; font-size:90%; text-transform:uppercase;}
.headerbuttons fieldset, .headerbuttons legend, .headerbuttons button, .headerbuttons select { font-size:10px; }
.headerbuttons fieldset { display:inline-block; border-radius:0; border-width:2px; padding:2px;}
.headerbuttons button, .headerbuttons select { font-size: 16px; padding:4px 2px; color:#666;}
.squiggle-box { display:none; text-align:center; position:absolute; top:55px; left:20%; width:60%; z-index:20; background-color:black; color:white; box-shadow:0 0 12px #666;}
.squiggle-box a { color:white; }
.squiggle-box img { vertical-align:middle; margin:0 4px; max-height:36px;}
table { margin: auto; }
table .aleft { text-align:left }
#formladder th { padding:4px; }
#squiggle-predictor table img, #squiggle-table table img, #flagpole_ranks img { max-height:18px; max-width:20px;}
table.squiggle-ladder td:first-child { text-align:right; }
table.squiggle-ladder:not(#doors-ladder):not(#gf-sims) td:first-child:after { content: "."; }
table.squiggle-ladder#doors-ladder td:nth-child(2):after { content: "."; }
table.squiggle-ladder td:nth-child(0n+2) { text-align:left; }
#predictor_ha_rounds { display:none; }
#predictor_ha_rounds span, #squiggle-tips span { font-size:13px; display:block; margin-top:-6px; margin-bottom:8px;}
#squiggle-predictor fieldset, #squiggle-predictor legend { background-color:#222; text-align:left; border-radius:6px; font-size:80%;}
#squiggle-tips-past { display:none; }
#squiggle-tips .squiggle-tip-right:before, #squiggle-tips .squiggle-tip-wrong:before { content:"\f06e"; font-family:FontAwesome; margin-right:0.25em;}
#squiggle-tips .squiggle-tip-right { color:#29E429; }
#squiggle-tips .squiggle-tip-wrong { color:#E42929; }
.finalsheader { letter-spacing:6px; font-size:14px;}
.fa-spin { text-shadow: none !important;}
a.hlink { display:inline-block; text-align:center; font-size:10px; color:#333; text-transform:uppercase; text-decoration:none; padding:0 6px; min-width:48px; vertical-align:middle; }
a.hlink:hover { color:#000; transition:none; text-shadow:1px 1px 1px #DDD; }
a.hlink i { color:#333; font-size: 32px; text-shadow:4px 4px 1px #DDD; transition:text-shadow 0.5s ease-out;}
a.hlink:hover i { color:#000; text-shadow:4px 4px 1px #999; transition:none;}
.highlight, a.highlight, a.highlight.hlink i { color:#DE4814 !important; }
#newpredictor { color:#CCC; display:none; }
#newpredictor i { text-shadow:4px 4px 1px #333; }
#newpredictor:hover { border-color:#111;}
#newpredictor:hover i { text-shadow:4px 4px 1px #FFF; }
#logobox { float:left; margin-right:8px;}
#headline { text-align:center; position:fixed; z-index:10; width:100%; background: linear-gradient(to bottom, rgba(235,235,235,1) 0%, rgba(235,235,235,1) 90%, rgba(235,235,235,0) 100%); }
.infobuttons { display:inline-block; margin-top:4px; transition:all 0.5s ease-out; }
.playerbuttons { display:inline-block; }
#chart-container { clear: both; width:1000px; height:1000px; max-width:100%; max-height:100%; margin:0 auto; }
p.pcenter { text-align:center; }
p.pright { text-align:right; margin-right:12px; }
.smalltext { font-size:90%; }
p.closeline { text-align:right; padding:0; margin:0; font-size:25px;}
p.closeline a { padding:12px; position:relative; top:14px; right:8px;}
#infobox { display:none; text-align:center; position:absolute; left:20%; width:60%; background-color:black; opacity:0.7; color:white; top:20%; padding:80px 20px; border-radius:18px; }
#squiggle-table.squiggle-box { left:0; width:100%; }
#squiggle-table.squiggle-box p { margin-left:1em; margin-right:1em; }
#flagpole { width:100%; height:400px; }
#flagpole .highcharts-data-labels img { transition:opacity 0.6s ease-out; opacity:0; margin-left:6px; }
#flagpole .highcharts-data-labels img.vis { opacity:1;}
#flagpole .highcharts-data-labels img.alive { box-shadow: 0px 0px 24px #FFF; }
#flagpole .highcharts-data-labels img.eliminated.vis { opacity:0.6; }
#flagpole-round-notifier { display:none; position:absolute; top:110px; color:#FFF; z-index:22; font-size:2em; text-align:center; width:100%; font-weight:bold;}
#squiggle-doors { width:80%; left: 10%; }
#doorssliders { position:relative; width:100%;}
.doorssliderbox { width:19%; color: #FCDC8F; letter-spacing: 0.4em;}
.doorssliderbox button { font-size:2.5vw; padding-left:0.5em; letter-spacing:0.5vw; font-weight:bold; }
#doorsslider { width: 60%; padding-top:4vw; display:inline-block; }
#doorsslider input { width:100%; margin:0; padding:0; }
#doorsslider input::-webkit-slider-thumb { height:40px;}
.doorsperc { font-weight:normal; font-size:6.5vw; letter-spacing:-2px; color:#C0AC7D; margin:0;}
#doorssubmit { font-size:2em; padding:0.5em; border-radius:1em; font-weight:bold; background-color:#F9F9F8; }
#squiggle-doors-content .newround { border: 4px solid #666; border-radius: 1em; margin: 1em 15%; padding: 0.5em; }
#squiggle-doors-content .newround.gf { border-color:#FFD660; color:#FFD660; }
.rankup { color:#0C0; font-weight:bold;}
.rankdown { color:#F00; font-weight:bold;}
#doors-ladder img.flag, #doors-different-results img { max-height:18px; }
#doors-different-results { color:#DDD; font-size:90%;}
#doors-different-results a { text-decoration:none; }
#doors-different-results a:hover { text-decoration:underline; }
.newresult { border:6px solid #F8DC9B; border-radius:1em; margin-left:15%; margin-right:15%; padding-top:0.2em; }
#squiggle-doors-rules { display:none; text-align:left; border-radius:1em; border-left: 4px solid #A8A389; margin:1em; padding-left:1em;}
#squiggle-doors-rules img { max-height:none; max-width:100%; }
img.miniflag { vertical-align:middle; margin:0 4px; max-height:18px; }
.bdr { border:1px solid #CCC; padding:3px; border-radius:2px; box-shadow:1px 1px 3px #999; }

.squiggleeditcat { display:none;}
#edit-new-game-template { display:none;}
#edit-new-gameslist .edit-new-game { border-top:1px solid #CCC;}
.select-a-team img, .select-venue button { transition:box-shadow 0.3s ease-out; cursor:pointer;}
.select-a-team img:hover, .select-venue button:hover { box-shadow: 0 0 4px white, 0 0 16px white; transition:none;}
.select-a-team img { margin:6px; max-width:44px;}
.select-a-team img.selected { max-width:none;}
.select-venue button { margin:6px 3px; min-width:8em; letter-spacing:1px; }
.edit-select-score { display:none; }
.edit-select-score .goal-behind-separator:before { content:"\25CF"; margin:0.5em;}
.edit-select-score input { font-size:2em; width:2em; text-align:center;}
/* .edit-select-score i { font-size:180%; cursor:pointer; color:#CCC; transition:text-shadow 0.3s ease-out; margin:0 0.5em;}
   .edit-select-score i:hover { color:white; text-shadow:0 0 1em white, 0 0 1em white; transition:none;}   */
.edit-select-score input.edit-totalscore { margin-left:1em; font-weight:bold; width:3em;}
.editcancel, .editaddanother { margin:0 1em; font-size:85%;}
#editsubmit { font-size:2em; padding:0.5em; border-radius:1em; font-weight:bold; background-color:#F9F9F8; cursor:pointer;}

.numberadj { display:flex; flex-direction:column;}

@media only screen and (max-width:850px)
{
    .squiggle-box { width:94% !important; left:3% !important; }
    #doorssliders button { background-color:#CCB; padding:1.2em 0.5em; }
}

@media only screen and (max-width:1000px)
{
    #headerfieldsets { display:none; }
    #headermenuopen { display:inline-block; vertical-align:inherit; }
}

#svgdefs { position:absolute; }

.highcharts-color-1 {
    fill: red;
    stroke: red;
}

.highcharts-graph {
    stroke-width:1.5px;
    /*  filter: url(#lineBorderBlack);*/
}

.highcharts-crosshair {
    stroke-width:2px;
    stroke:#DDD;
}

.highcharts-tooltip {
    opacity:0.85;
}

.highcharts-markers:not(.highcharts-series-0) image {
    filter: url(#drop1);
}

.highcharts-data-label {
    font-weight:normal;
    text-shadow:0 0 1px white, 0 0 1px white, 0 0 1px white, 0 0 1px white, 0 0 1px white, 0 0 1px white, 0 0 1px white;
    font-size:0.8em;
    letter-spacing:2px;
}

.highcharts-xaxis-grid .highcharts-grid-line, .highcharts-yaxis-grid .highcharts-grid-line {
    stroke-width:1;
    stroke-dasharray:2;
    stroke:#DDD;
}

.highcharts-data-label text {
    fill:#888;
}

.highcharts-title, .highcharts-subtitle, .highcharts-axis-title {
    font-size:48px;font-weight:bold;text-shadow:1px 1px 2px #999;fill:black;letter-spacing:-1px;
}
.highcharts-subtitle {
    fill:#CCC;font-size:44px;
}

.highcharts-axis-title {
    fill:#FFF;
    filter:url(#lb3);
    font-size:86px;
}

.highcharts-point {
    stroke-width: 1px;
    fill:none !important;
    stroke:none !important;
}

.highcharts-axis-labels {
    fill:white;
    cursor: default;
    font-size:16px;
    font-weight:bold;
    filter: url(#lb2);
}

.highcharts-xaxis .highcharts-axis-line {
    stroke:none;
}

/* Fade series markers as well, not just lines */
.highcharts-legend-series-active g.highcharts-markers:not(.highcharts-series-hover) { opacity:0.3; }
g.highcharts-markers { transition: opacity 250ms; }

.highcharts-legend-item text { font-size:13px; }

.highcharts-legend-item path.highcharts-graph { stroke-width:0; /* no lines */ }

.highcharts-legend-item-hidden * { transition:fill 250ms, opacity 250ms; opacity:0.5; }

/* Adelaide */
.highcharts-color-1,.highcharts-color-1.highcharts-legend-item text { fill: #ffd94a; stroke: #ffd94a; /* yellow */ }
.highcharts-color-1 .highcharts-graph { stroke-width:1; /* thinner so we can fit in more border */ }
.highcharts-color-1 .highcharts-graph, .highcharts-color-1.highcharts-tooltip,.highcharts-color-1.highcharts-legend-item { filter: url(#lineBorderRedBlue) !important; }
.highcharts-color-1 .highcharts-point { stroke:#ffd94a; stroke-width:1; }

/* Brisbane */
.highcharts-color-2,.highcharts-color-2.highcharts-legend-item text { fill: #febf57; stroke: #febf57; /* yellow */ }
.highcharts-color-2 .highcharts-graph { stroke-width:1; /* thinner so we can fit in more border */ }
.highcharts-color-2 .highcharts-graph, .highcharts-color-2.highcharts-tooltip,.highcharts-color-2.highcharts-legend-item { filter: url(#lineBorderBlueMaroon) !important; }

/* Carlton */
.highcharts-color-3,.highcharts-color-3.highcharts-legend-item text { fill:#a5a5de; stroke: #a5a5de; /* blue */ }
.highcharts-color-3 .highcharts-graph, .highcharts-color-3.highcharts-tooltip,.highcharts-color-3.highcharts-legend-item { filter: url(#lineBorderBlue) !important; }

/* Collingwood */
.highcharts-color-4,.highcharts-color-4.highcharts-legend-item text { fill: #FFFFFF; stroke: #FFFFFF; }
.highcharts-color-4 .highcharts-graph, .highcharts-color-4.highcharts-tooltip,.highcharts-color-4.highcharts-legend-item { filter: url(#lineBorderBlack) !important; }

/* Essendon */
.highcharts-color-5,.highcharts-color-5.highcharts-legend-item text { fill:red; stroke:red /* red */ }
.highcharts-color-5 .highcharts-graph, .highcharts-color-5.highcharts-tooltip,.highcharts-color-5.highcharts-legend-item { filter: url(#lineBorderBlack) !important; }

/* Fremantle */
.highcharts-color-6,.highcharts-color-6.highcharts-legend-item text { fill:#ffffff; stroke:#ffffff /* white */ }
.highcharts-color-6 .highcharts-graph, .highcharts-color-6.highcharts-tooltip,.highcharts-color-6.highcharts-legend-item { filter: url(#lineBorderPurple) !important; }

/* Geelong */
.highcharts-color-7,.highcharts-color-7.highcharts-legend-item text { fill:#ffffff; stroke:#ffffff /* white */ }
.highcharts-color-7 .highcharts-graph, .highcharts-color-7.highcharts-tooltip,.highcharts-color-7.highcharts-legend-item { filter: url(#lineBorderBlue) !important; }

/* Gold Coast */
.highcharts-color-8,.highcharts-color-8.highcharts-legend-item text { fill:#edc932; stroke:#edc932 /* yellow */ }
.highcharts-color-8 .highcharts-graph, .highcharts-color-8.highcharts-tooltip,.highcharts-color-8.highcharts-legend-item { filter: url(#lineBorderRed) !important; }

/* GWS */
.highcharts-color-9,.highcharts-color-9.highcharts-legend-item text { fill:#d4d4d4; stroke:#d4d4d4; /* gray */ }
.highcharts-color-9 .highcharts-graph, .highcharts-color-9.highcharts-tooltip,.highcharts-color-9.highcharts-legend-item { filter: url(#lineBorderOrange) !important; }

/* Hawthorn */
.highcharts-color-10,.highcharts-color-10.highcharts-legend-item text { fill:#ffb804; stroke:#ffb804; /* mustard */ }
.highcharts-color-10 .highcharts-graph, .highcharts-color-10.highcharts-tooltip,.highcharts-color-10.highcharts-legend-item { filter: url(#lineBorderBrown) !important; }

/* Melbourne */
.highcharts-color-11,.highcharts-color-11.highcharts-legend-item text { fill:#be1c0d; stroke:#be1c0d /* red */ }
.highcharts-color-11 .highcharts-graph, .highcharts-color-11.highcharts-tooltip,.highcharts-color-11.highcharts-legend-item { filter: url(#lineBorderBlue) !important; }

/* North Melbourne */
.highcharts-color-12,.highcharts-color-12.highcharts-legend-item text { fill:#ffffff; stroke:#ffffff /* white */ }
.highcharts-color-12 .highcharts-graph, .highcharts-color-12.highcharts-tooltip,.highcharts-color-12.highcharts-legend-item { filter: url(#lineBorderLightBlue) !important; }

/* Port */
.highcharts-color-13,.highcharts-color-13.highcharts-legend-item text { fill:#ffffff; stroke:#ffffff; /* white */ }
.highcharts-color-13 .highcharts-graph, .highcharts-color-13.highcharts-tooltip,.highcharts-color-13.highcharts-legend-item { filter: url(#lineBorderTeal) !important; }

/* Richmond */
.highcharts-color-14,.highcharts-color-14.highcharts-legend-item text { fill: #ffd94a; stroke: #ffd94a /* yellow */ }
.highcharts-color-14 .highcharts-graph, .highcharts-color-14.highcharts-tooltip,.highcharts-color-14.highcharts-legend-item { filter: url(#lineBorderBlack) !important; }

/* St Kilda */
.highcharts-color-15,.highcharts-color-15.highcharts-legend-item text { fill:#ffffff; stroke: #ffffff; /* white */ }
.highcharts-color-15 .highcharts-graph, .highcharts-color-15.highcharts-tooltip,.highcharts-color-15.highcharts-legend-item { filter: url(#lineBorderRedBlack) !important; }

/* Sydney */
.highcharts-color-16,.highcharts-color-16.highcharts-legend-item text { fill:white; stroke:white; }
.highcharts-color-16 .highcharts-graph, .highcharts-color-16.highcharts-tooltip,.highcharts-color-16.highcharts-legend-item { filter: url(#lineBorderRed) !important; }
.highcharts-color-16 .highcharts-point { stroke:#d42b1e; stroke-width:0; }

/* West Coast */
.highcharts-color-17,.highcharts-color-17.highcharts-legend-item text { fill:yellow; stroke:#ffdd48; /* yellow */ }
.highcharts-color-17 .highcharts-graph, .highcharts-color-17.highcharts-tooltip,.highcharts-color-17.highcharts-legend-item { filter: url(#lineBorderBlue) !important; }

/* Western Bulldogs */
.highcharts-color-18,.highcharts-color-18.highcharts-legend-item text { fill:#ffffff; stroke: #ffffff; /* white */ }
.highcharts-color-18 .highcharts-graph, .highcharts-color-18.highcharts-tooltip,.highcharts-color-18.highcharts-legend-item { filter: url(#lineBorderRedBlue2) !important; }

/* Fitzroy */
.highcharts-color-19,.highcharts-color-19.highcharts-legend-item text { fill:red; stroke:red; /* red */ }
.highcharts-color-19 .highcharts-graph, .highcharts-color-19.highcharts-tooltip,.highcharts-color-19.highcharts-legend-item { filter: url(#lineBorderBlueRed) !important; }


/*
 * Flagpole
 */

#flagpole .highcharts-background { fill:#000000; }
#flagpole .highcharts-xaxis-grid .highcharts-grid-line { stroke-width:0; }
#flagpole .highcharts-yaxis-grid .highcharts-grid-line { stroke:#444444; stroke-dasharray:0; }
#flagpole .highcharts-point { stroke-width:3px; stroke:#777 !important; }

/*
 * Tower of Power
 */
#tower-container { min-width:310px; height:796px; max-width:400px; margin:0 auto; }
#tower-container .highcharts-xaxis-grid .highcharts-grid-line,
#tower-container .highcharts-yaxis-grid .highcharts-grid-line,
#tower-container .highcharts-tick
{
  stroke-width:0;
}
#tower-container .highcharts-background { fill:#000000; }
#tower-container .highcharts-color-0,
#tower-container .highcharts-color-1,
#tower-container .highcharts-color-2,
#tower-container .highcharts-color-3,
#tower-container .highcharts-color-4,
#tower-container .highcharts-color-5,
#tower-container .highcharts-color-6,
#tower-container .highcharts-color-7,
#tower-container .highcharts-color-8,
#tower-container .highcharts-color-9,
#tower-container .highcharts-color-10,
#tower-container .highcharts-color-11,
#tower-container .highcharts-color-12,
#tower-container .highcharts-color-13,
#tower-container .highcharts-color-14,
#tower-container .highcharts-color-15,
#tower-container .highcharts-color-16,
#tower-container .highcharts-color-17,
#tower-container .highcharts-color-18
{
  fill: #FFFFFF;
  stroke: #444444;
  }
#tower-container .highcharts-color-0 .highcharts-graph,
#tower-container .highcharts-color-1 .highcharts-graph,
#tower-container .highcharts-color-2 .highcharts-graph,
#tower-container .highcharts-color-3 .highcharts-graph,
#tower-container .highcharts-color-4 .highcharts-graph,
#tower-container .highcharts-color-5 .highcharts-graph,
#tower-container .highcharts-color-6 .highcharts-graph,
#tower-container .highcharts-color-7 .highcharts-graph,
#tower-container .highcharts-color-8 .highcharts-graph,
#tower-container .highcharts-color-9 .highcharts-graph,
#tower-container .highcharts-color-10 .highcharts-graph,
#tower-container .highcharts-color-11 .highcharts-graph,
#tower-container .highcharts-color-12 .highcharts-graph,
#tower-container .highcharts-color-13 .highcharts-graph,
#tower-container .highcharts-color-14 .highcharts-graph,
#tower-container .highcharts-color-15 .highcharts-graph,
#tower-container .highcharts-color-16 .highcharts-graph,
#tower-container .highcharts-color-17 .highcharts-graph,
#tower-container .highcharts-color-18 .highcharts-graph,
#tower-container .highcharts-color-19 .highcharts-graph
{
  filter: none !important;
}

#tower-container .highcharts-area {
    fill-opacity:1;
    stroke-width:4px;
    stroke:rgba(255,255,255,0.5);
}

#tower-container .highcharts-area-series .highcharts-point {
    stroke-width:0;
    fill:none;
}

#tower-container .highcharts-series-group {
    clip-path:inset(1.5em 0px);
}

#tower-container .highcharts-axis-labels,
#tower-container .highcharts-title,
#tower-container .highcharts-subtitle {
    fill:#333333;
    cursor: default;
    font-size: 16px;
    font-weight: bold;
    filter: url(#lb2);
}

#tower-container .highcharts-title { font-size:32px; }
#tower-container .highcharts-subtitle { font-size: 20px; }

#tower-finals-chances td { text-align:center; font-size:85%;}
#tower-finals-chances td:nth-child(1), #tower-finals-chances td:nth-child(2) { text-align:left; font-size:100%; }
#tower-finals-chances img { max-height:18px; }

#tower-mode-ladder td:nth-child(1), #tower-mode-ladder td:nth-child(2), #tower-mode-ladder td:nth-child(3) { text-align:left; }
#tower-mode-ladder img { max-height:18px; }

#squiggle-tips span.hgaline { color:#999; margin-top:-24px;}
#squiggle-tips span.hgaline abbr { font-size:11px;}
#squiggle-tips img.niceline_adjustment { max-height:1.5em; margin-right:0; filter:drop-shadow(0px 0px 1px #CCC);}

.ibox { display:inline-block; width:33px; text-align:center;}
.ibox img {filter: drop-shadow(0px 1px 3px #999);}
.linelogo { filter:drop-shadow(1px 1px 0 rgba(255,255,255,0.75)); max-height:none;}
.number-suffix { font-size: 75%; position: relative; top: -0.25em; margin-left: 1px; }

.fbar-block { width: 100%; background: #666; display:flex;}
.fbar { background:#3b863b; overflow:hidden; font-size:55%; line-height:2em; border-right:1px solid black; cursor:default; }

table#gf-sims td:nth-child(2) { padding: 0.25em 1em; }
.gfsimbar { display: block; background:#3b863b; font-size:55%; height:2em; background-position: 50% 50%;}