@CHARSET "UTF-8";

@font-face {
  font-family: "iconvault";
  src: url("/layout/fonts/iconvault_forecastfont.eot");
  src: url("/layout/fonts/iconvault_forecastfont.eot?#iefix") format("embedded-opentype"),
       url("/layout/fonts/iconvault_forecastfont.woff") format("woff"),
       url("/layout/fonts/iconvault_forecastfont.ttf") format("truetype"),
       url("/layout/fonts/iconvault_forecastfont.svg#iconvault") format("svg");
  font-weight: normal;
  font-style: normal;
}

.forecast { width:100%; margin:0; padding:0; border:0; border-spacing:0; border-collapse:collapse; }
.forecast.condensed { margin:5px; border-spacing:0; font-size:11px }
.forecast h3 { font-weight:bold !important; font-size:110% !important; text-align:center !important; margin:15px 0 0 0 !important; }
.forecast .fc_stats { font-size:11px; text-align:center; }
.forecast .current .fc_temp { font-weight:bold; font-size:14px; text-align:center; }
.forecast.condensed .fc_temp, .forecast.condensed .current .fc_temp { font-weight:normal; font-size:11px; white-space:nowrap; }
.forecast .date { font-size:11px; text-align:center; opacity:0.7; }
.forecast .conditions { font-size:11px; text-align:center; }
.forecast .source { text-align:center; font-size:11px; opacity:0.3; margin-top:15px; }
.forecast.extended tr td p { margin:5px 10px; font-style:italic; }


/* DETAILED FORECAST */
.fc-day { text-align:right; }
.fc-icon { padding:0 15px; }
.fc-conditions { text-align:right; vertical-align:middle; }
.fc-details { text-align:left; vertical-align:middle; }

/* FORECAST FONTS */

.forecast .wtr-icon { font-size:18px; width:6em; height:6em; line-height:6em; display:block; margin:auto; }
.forecast.condensed .wtr-icon { font-size:8px; text-align:normal; }

.forecast .wtr-icon [class^="icon-"],
.forecast .wtr-icon [class*=" icon-"] { font-family: 'iconvault'; font-size:6em; font-weight: normal; font-style: normal; text-decoration: inherit; -webkit-font-smoothing: antialiased; }

.forecast .wtr-icon [class^="icon-"]::before,
.forecast .wtr-icon [class*=" icon-"]::before,
.forecast .wtr-icon [class^="icon-"]::after,
.forecast .wtr-icon [class*=" icon-"]::after { font-family:"iconvault"; position:absolute; font-style:normal; font-weight:normal; font-variant:normal; text-transform:none; text-decoration:inherit; -webkit-font-smoothing:antialiased; }

.forecast .basecloud::before { font-family: 'iconvault'; font-size:6em; content: '\f105'; position:absolute; color:rgb(204, 204, 204); }
.forecast .windyraincloud::before { font-family: 'iconvault'; font-size:6em; content: '\f111'; position:absolute; color:rgb(204, 204, 204); }
.forecast .windysnowcloud::before { font-family: 'iconvault'; font-size:6em; content: '\f109'; position:absolute; color:rgb(204, 204, 204); }
.forecast .basethundercloud::before { font-family: 'iconvault'; font-size:6em; content: '\f105'; position:absolute; color:#000; }

.forecast .icon-basecloud::before { content:"\f105"; color:rgb(204, 204, 204); }
.forecast .icon-windysnowcloud::before { content:"\f109"; color:rgb(204, 204, 204); }
.forecast .icon-windyraincloud::before { content:"\f111"; color:rgb(204, 204, 204); }

.forecast .icon-thunder::before { content:"\f114"; color:rgb(255, 165, 0); }
.forecast .icon-sunny::after { content:"\f101"; color:rgb(255, 165, 0); }
.forecast .icon-drizzle::before { content:"\f10a"; color: #82b2e4; }
.forecast .icon-hail::before { content:"\f10f"; color:rgb(204, 204, 204); }
.forecast .icon-showers::before { content:"\f104"; color:#82b2e4; }
.forecast .icon-rainy::before { content:"\f107"; color:#4681c3; }
.forecast .icon-snowy::before { content:"\f10b"; color:#acd3f3; }
.forecast .icon-frosty::before { content:"\f102"; color:#85d8f7; }
.forecast .icon-windy::before { content:"\f115"; color:rgb(204, 204, 204); }
.forecast .icon-windyrain::before { content:"\f10e"; color:#acd3f3; }
.forecast .icon-windysnow::before { content:"\f103"; color:#acd3f3; }
.forecast .icon-sleet::before { content:"\f10c"; color:#acd3f3; }
.forecast .icon-sunrise::before { content:"\f112"; color:rgb(255, 165, 0); }
.forecast .icon-sunset::before { content:"\f110"; color:#f96f23; }
.forecast .icon-mist::before { content:"\f108"; color:rgb(204, 204, 204); }
.forecast .icon-cloud-sm::before { content:"\f106"; color:rgb(204, 204, 204); }

.forecast .icon-moon::after { content:"\f10d"; color:rgb(255, 165, 0); }
.forecast .icon-night::after { content:"\f100"; color:rgb(255, 165, 0); }
.forecast .icon-sun::after { content:"\f113"; color:rgb(255, 165, 0); }
.forecast .icon-cloud::after { content:"\f106"; color:rgb(204, 204, 204); }

/* Mostly Sunny / Visible */
.forecast .ec-01 .icon-cloud::after { font-size:80%; transform: translateY(5%); }
.forecast .ec-01 .icon-sunny::after { font-size: 150%; transform: translateX(-33%) translateY(17%); }
.forecast .ec-31 .icon-cloud::after { font-size:80%; transform: translateY(5%); }
.forecast .ec-31 .icon-night::after { font-size: 150%; transform: translateX(-33%) translateY(17%); }

/* Very Cloudy */
.forecast .ec-03 .icon-cloud-sm::before,
.forecast .ec-10 .icon-cloud-sm::before,
.forecast .ec-20 .icon-cloud-sm::before,
.forecast .ec-21 .icon-cloud-sm::before,
.forecast .ec-24 .icon-cloud-sm::before,
.forecast .ec-33 .icon-cloud-sm::before { font-size: 50%; transform: translateX(51%) translateY(18%); font-weight: bold !important; }

.forecast .ec-03 .basecloud::before,
.forecast .ec-04 .basecloud::before,
.forecast .ec-05 .basecloud::before,
.forecast .ec-10 .basecloud::before,
.forecast .ec-20 .basecloud::before,
.forecast .ec-21 .basecloud::before,
.forecast .ec-24 .basecloud::before,
.forecast .ec-33 .basecloud::before { transform:translateX(4%); }

/* Smaller Cloud */
.forecast .ec-02 .icon-cloud::after,
.forecast .ec-04 .icon-cloud::after,
.forecast .ec-05 .icon-cloud::after,
.forecast .ec-22 .icon-cloud::after,
.forecast .ec-23 .icon-cloud::after,
.forecast .ec-32 .icon-cloud::after,
.forecast .ec-34 .icon-cloud::after,
.forecast .ec-35 .icon-cloud::after { font-size: 80%; transform: translateX(18%) translateY(5%); }

/* After Smaller Cloud */
.forecast .ec-02 .icon-sunny::after,
.forecast .ec-04 .icon-sunny::after,
.forecast .ec-05 .icon-sunny::after,
.forecast .ec-22 .icon-sunny::after,
.forecast .ec-23 .icon-night::after,
.forecast .ec-32 .icon-night::after,
.forecast .ec-34 .icon-night::after,
.forecast .ec-35 .icon-night::after { transform:translateY(5%); }

/* Increasing / Decreasing */
.forecast .fa-stack { transform:translateX(100%) translateY(-20%); color:rgb(204, 204, 204); }