/* ---------------------------------------------------- www: mobile css: icons -------------------------------------------------------*/ /* =icon default settings -------------------------------------------------------*/ .icon {display:block; font-style:normal; height:2.5em; margin:0 auto; overflow:hidden; text-indent:100%; white-space:nowrap; width:2.5em;} .icon em {font-style:normal;} /* =icon size (ems) -------------------------------------------------------*/ .icon[data-size="16"] {font-size:0.4em;} .icon[data-size="24"] {font-size:0.6em;} .icon[data-size="32"] {font-size:0.8em;} .icon[data-size="40"] {font-size:1.0em} .icon[data-size="48"] {font-size:1.2em;} .icon[data-size="56"] {font-size:1.4em;} .icon[data-size="64"] {font-size:1.6em;} .icon[data-size="72"] {font-size:1.8em;} .icon[data-size="80"] {font-size:2.0em;} .icon[data-size="88"] {font-size:2.2em;} .icon[data-size="96"] {font-size:2.4em;} /* =icon (aq - air quality) -------------------------------------------------------*/ .icon[data-type="aq"] { background:url(../images/icons/air-quality.svg) no-repeat 0 0; -webkit-background-size:15em 5em; -o-background-size:15em 5em; -moz-background-size:15em 5em; background-size:15em 5em; color:#000; line-height:2.5em; overflow:visible; text-align: center; text-indent: 0; white-space:normal; } .icon[data-type="aq"].icon[data-img="png"] {background-image:url(../images/icons/air-quality.svg);} .icon[data-type="aq"] {background-position:0 0;} /* No data */ .icon[data-type="aq"].icon[data-value="1"] {background-position:-2.5em 0;} .icon[data-type="aq"].icon[data-value="2"] {background-position:-5em 0;} .icon[data-type="aq"].icon[data-value="3"] {background-position:-7.5em 0;} .icon[data-type="aq"].icon[data-value="4"] {background-position:-10em 0;} .icon[data-type="aq"].icon[data-value="5"] {background-position:-12.5em 0;} .icon[data-type="aq"].icon[data-value="6"] {background-position:0 -2.5em;} .icon[data-type="aq"].icon[data-value="7"] {background-position:-2.5em -2.5em;} .icon[data-type="aq"].icon[data-value="8"] {background-position:-5em -2.5em;} .icon[data-type="aq"].icon[data-value="9"] {background-position:-7.5em -2.5em;} .icon[data-type="aq"].icon[data-value="10"] {background-position:-10em -2.5em;} /* =icon (logo) -------------------------------------------------------*/ .icon[data-type="logo"] { background:url(../images/icons/mo-all-logos.svg) no-repeat; -webkit-background-size:5.3em 4em; -o-background-size:5.3em 4em; -moz-background-size:5.3em 4em; background-size:5.3em 4em; font-size:25px; } .icon[data-type="logo"].icon[data-value="green-white"] {background-position:-1em 0;} .icon[data-type="logo"].icon[data-value="black"] {background-position:-1em -1.35em;} .icon[data-type="logo"].icon[data-value="white"] {background-position:-1em -2.7em;} /* =icon (moons) -------------------------------------------------------*/ .icon[data-type="moon"] { background:url(../images/icons/moon.svg) no-repeat 0 0; -webkit-background-size:10em 5em; -o-background-size:10em 5em; -moz-background-size:10em 5em; background-size:10em 5em; } .icon[data-type="moon"].icon[data-img="png"] {background-image:url(../images/icons/moon.png);} /* .png alternative */ /* moon phases */ .icon[data-type="moon"].icon[data-value="New"] {background-position:0 0;} .icon[data-type="moon"].icon[data-value="Waxing crescent"] {background-position:-2.5em 0;} .icon[data-type="moon"].icon[data-value="First quarter"] {background-position:-5em 0;} .icon[data-type="moon"].icon[data-value="Waxing gibbous"] {background-position:-7.5em 0;} .icon[data-type="moon"].icon[data-value="Full"] {background-position:0 -2.5em;} .icon[data-type="moon"].icon[data-value="Waning gibbous"] {background-position:-2.5em -2.5em;} .icon[data-type="moon"].icon[data-value="Third quarter"] {background-position:-5em -2.5em;} .icon[data-type="moon"].icon[data-value="Waning crescent"] {background-position:-7.5em -2.5em;} /* =icon (sun) -------------------------------------------------------*/ .icon[data-type="sun"] { background:url(../images/icons/sun.svg) no-repeat 0 0; -webkit-background-size:5em 2.5em; -o-background-size:5em 2.5em; -moz-background-size:5em 2.5em; background-size:5em 2.5em; } /* moon phases */ .icon[data-type="sun"].icon[data-value="sunrise"] {background-position:0 0;} .icon[data-type="sun"].icon[data-value="sunset"] {background-position:-2.5em 0;} /* =icon (notices - exclamation marks) -------------------------------------------------------*/ .icon[data-type="notice"] { background:url(../images/icons/notice.svg) no-repeat 0 0; -webkit-background-size:10em 7.5em; -o-background-size:10em 7.5em; -moz-background-size:10em 7.5em; background-size:10em 7.5em; } .icon[data-type="notice"].icon[data-img="png"] {background-image:url(../images/icons/notice.png);} /* .png alternative */ /* no outline - default to black */ .icon[data-type="notice"].icon[data-value="yellow"] {background-position:0 0;} .icon[data-type="notice"].icon[data-value="amber"] {background-position:-2.5em 0;} .icon[data-type="notice"].icon[data-value="red"] {background-position:-5em 0;} .icon[data-type="notice"].icon[data-value="clear"] {background-position:-7.5em 0;} /* black */ .icon[data-type="notice"].icon[data-value="yellow"].icon[data-outline="black"] {background-position:0 0;} .icon[data-type="notice"].icon[data-value="amber"].icon[data-outline="black"] {background-position:-2.5em 0;} .icon[data-type="notice"].icon[data-value="red"].icon[data-outline="black"] {background-position:-5em 0;} .icon[data-type="notice"].icon[data-value="clear"].icon[data-outline="black"] {background-position:-7.5em 0;} /* white */ .icon[data-type="notice"].icon[data-value="yellow"].icon[data-outline="white"] {background-position:0 -2.5em;} .icon[data-type="notice"].icon[data-value="amber"].icon[data-outline="white"] {background-position:-2.5em -2.5em;} .icon[data-type="notice"].icon[data-value="red"].icon[data-outline="white"] {background-position:-5em -2.5em;} .icon[data-type="notice"].icon[data-value="clear"].icon[data-outline="white"] {background-position:-7.5em -2.5em;} /* blue */ .icon[data-type="notice"].icon[data-value="yellow"].icon[data-outline="blue"] {background-position:0 -5em;} .icon[data-type="notice"].icon[data-value="amber"].icon[data-outline="blue"] {background-position:-2.5em -5em;} .icon[data-type="notice"].icon[data-value="red"].icon[data-outline="blue"] {background-position:-5em -5em;} .icon[data-type="notice"].icon[data-value="clear"].icon[data-outline="blue"] {background-position:-7.5em -5em;} /* =icon (temp) -------------------------------------------------------*/ .icon[data-type="temp"] {display:block; height:20px; text-align:center; overflow:visible; text-indent:0; white-space:normal; width:100%;} .icon[data-type="temp"].icon[data-value="-60"] {background:#010514; color:#fff; margin-bottom:-60px; padding-bottom:60px;} .icon[data-type="temp"].icon[data-value="-59"] {background:#010514; color:#fff; margin-bottom:-59px; padding-bottom:59px;} .icon[data-type="temp"].icon[data-value="-58"] {background:#010514; color:#fff; margin-bottom:-58px; padding-bottom:58px;} .icon[data-type="temp"].icon[data-value="-57"] {background:#010514; color:#fff; margin-bottom:-57px; padding-bottom:57px;} .icon[data-type="temp"].icon[data-value="-56"] {background:#010514; color:#fff; margin-bottom:-56px; padding-bottom:56px;} .icon[data-type="temp"].icon[data-value="-55"] {background:#010514; color:#fff; margin-bottom:-55px; padding-bottom:55px;} .icon[data-type="temp"].icon[data-value="-54"] {background:#010514; color:#fff; margin-bottom:-54px; padding-bottom:54px;} .icon[data-type="temp"].icon[data-value="-53"] {background:#010514; color:#fff; margin-bottom:-53px; padding-bottom:53px;} .icon[data-type="temp"].icon[data-value="-52"] {background:#010514; color:#fff; margin-bottom:-52px; padding-bottom:52px;} .icon[data-type="temp"].icon[data-value="-51"] {background:#010514; color:#fff; margin-bottom:-51px; padding-bottom:51px;} .icon[data-type="temp"].icon[data-value="-50"] {background:#010514; color:#fff; margin-bottom:-50px; padding-bottom:50px;} .icon[data-type="temp"].icon[data-value="-49"] {background:#010514; color:#fff; margin-bottom:-49px; padding-bottom:49px;} .icon[data-type="temp"].icon[data-value="-48"] {background:#010514; color:#fff; margin-bottom:-48px; padding-bottom:48px;} .icon[data-type="temp"].icon[data-value="-47"] {background:#010514; color:#fff; margin-bottom:-47px; padding-bottom:47px;} .icon[data-type="temp"].icon[data-value="-46"] {background:#010514; color:#fff; margin-bottom:-46px; padding-bottom:46px;} .icon[data-type="temp"].icon[data-value="-45"] {background:#010514; color:#fff; margin-bottom:-45px; padding-bottom:45px;} .icon[data-type="temp"].icon[data-value="-44"] {background:#010514; color:#fff; margin-bottom:-44px; padding-bottom:44px;} .icon[data-type="temp"].icon[data-value="-43"] {background:#010514; color:#fff; margin-bottom:-43px; padding-bottom:43px;} .icon[data-type="temp"].icon[data-value="-42"] {background:#010514; color:#fff; margin-bottom:-42px; padding-bottom:42px;} .icon[data-type="temp"].icon[data-value="-41"] {background:#010514; color:#fff; margin-bottom:-41px; padding-bottom:41px;} .icon[data-type="temp"].icon[data-value="-40"] {background:#010514; color:#fff; margin-bottom:-40px; padding-bottom:40px;} .icon[data-type="temp"].icon[data-value="-39"] {background:#010514; color:#fff; margin-bottom:-39px; padding-bottom:39px;} .icon[data-type="temp"].icon[data-value="-38"] {background:#010514; color:#fff; margin-bottom:-38px; padding-bottom:38px;} .icon[data-type="temp"].icon[data-value="-37"] {background:#010514; color:#fff; margin-bottom:-37px; padding-bottom:37px;} .icon[data-type="temp"].icon[data-value="-36"] {background:#010514; color:#fff; margin-bottom:-36px; padding-bottom:36px;} .icon[data-type="temp"].icon[data-value="-35"] {background:#010514; color:#fff; margin-bottom:-35px; padding-bottom:35px;} .icon[data-type="temp"].icon[data-value="-34"] {background:#010514; color:#fff; margin-bottom:-34px; padding-bottom:34px;} .icon[data-type="temp"].icon[data-value="-33"] {background:#010514; color:#fff; margin-bottom:-33px; padding-bottom:33px;} .icon[data-type="temp"].icon[data-value="-32"] {background:#010514; color:#fff; margin-bottom:-32px; padding-bottom:32px;} .icon[data-type="temp"].icon[data-value="-31"] {background:#010514; color:#fff; margin-bottom:-31px; padding-bottom:31px;} .icon[data-type="temp"].icon[data-value="-30"] {background:#010514; color:#fff; margin-bottom:-30px; padding-bottom:30px;} .icon[data-type="temp"].icon[data-value="-29"] {background:#01081E; color:#fff; margin-bottom:-29px; padding-bottom:29px;} .icon[data-type="temp"].icon[data-value="-28"] {background:#010A26; color:#fff; margin-bottom:-28px; padding-bottom:28px;} .icon[data-type="temp"].icon[data-value="-27"] {background:#010D31; color:#fff; margin-bottom:-27px; padding-bottom:27px;} .icon[data-type="temp"].icon[data-value="-26"] {background:#02103C; color:#fff; margin-bottom:-26px; padding-bottom:26px;} .icon[data-type="temp"].icon[data-value="-25"] {background:#021345; color:#fff; margin-bottom:-25px; padding-bottom:25px;} .icon[data-type="temp"].icon[data-value="-24"] {background:#02154F; color:#fff; margin-bottom:-24px; padding-bottom:24px;} .icon[data-type="temp"].icon[data-value="-23"] {background:#021859; color:#fff; margin-bottom:-23px; padding-bottom:23px;} .icon[data-type="temp"].icon[data-value="-22"] {background:#031B63; color:#fff; margin-bottom:-22px; padding-bottom:22px;} .icon[data-type="temp"].icon[data-value="-21"] {background:#031E6E; color:#fff; margin-bottom:-21px; padding-bottom:21px;} .icon[data-type="temp"].icon[data-value="-20"] {background:#082376; color:#fff; margin-bottom:-20px; padding-bottom:20px;} .icon[data-type="temp"].icon[data-value="-19"] {background:#132D7C; color:#fff; margin-bottom:-19px; padding-bottom:19px;} .icon[data-type="temp"].icon[data-value="-18"] {background:#203883; color:#fff; margin-bottom:-18px; padding-bottom:18px;} .icon[data-type="temp"].icon[data-value="-17"] {background:#2C438A; color:#fff; margin-bottom:-17px; padding-bottom:17px;} .icon[data-type="temp"].icon[data-value="-16"] {background:#374E90; color:#fff; margin-bottom:-16px; padding-bottom:16px;} .icon[data-type="temp"].icon[data-value="-15"] {background:#435897; color:#fff; margin-bottom:-15px; padding-bottom:15px;} .icon[data-type="temp"].icon[data-value="-14"] {background:#4F639D; color:#fff; margin-bottom:-14px; padding-bottom:14px;} .icon[data-type="temp"].icon[data-value="-13"] {background:#5B6DA4; color:#fff; margin-bottom:-13px; padding-bottom:13px;} .icon[data-type="temp"].icon[data-value="-12"] {background:#6778AA; color:#fff; margin-bottom:-12px; padding-bottom:12px;} .icon[data-type="temp"].icon[data-value="-11"] {background:#7382B1; color:#fff; margin-bottom:-11px; padding-bottom:11px;} .icon[data-type="temp"].icon[data-value="-10"] {background:#7F8DB8; color:#fff; margin-bottom:-10px; padding-bottom:10px;} .icon[data-type="temp"].icon[data-value="-9"] {background:#8B98BF; color:#000; margin-bottom:-9px; padding-bottom:9px;} .icon[data-type="temp"].icon[data-value="-8"] {background:#98A4C6; color:#000; margin-bottom:-8px; padding-bottom:8px;} .icon[data-type="temp"].icon[data-value="-7"] {background:#A2ACCB; color:#000; margin-bottom:-7px; padding-bottom:7px;} .icon[data-type="temp"].icon[data-value="-6"] {background:#AFB8D3; color:#000; margin-bottom:-6px; padding-bottom:6px;} .icon[data-type="temp"].icon[data-value="-5"] {background:#BBC2D9; color:#000; margin-bottom:-5px; padding-bottom:5px;} .icon[data-type="temp"].icon[data-value="-4"] {background:#C6CCDF; color:#000; margin-bottom:-4px; padding-bottom:4px;} .icon[data-type="temp"].icon[data-value="-3"] {background:#D3D7E6; color:#000; margin-bottom:-3px; padding-bottom:3px;} .icon[data-type="temp"].icon[data-value="-2"] {background:#DEE2ED; color:#000; margin-bottom:-2px; padding-bottom:2px;} .icon[data-type="temp"].icon[data-value="-1"] {background:#EAEDF3; color:#000; margin-bottom:-1px; padding-bottom:1px;} .icon[data-type="temp"].icon[data-value="0"] {background:#F5F6FA; color:#000; margin:0; padding:0;} .icon[data-type="temp"].icon[data-value="1"] {background:#FFF9E8; color:#000; margin-top:-1px; padding-top:1px;} .icon[data-type="temp"].icon[data-value="2"] {background:#FFF5D9; color:#000; margin-top:-2px; padding-top:2px;} .icon[data-type="temp"].icon[data-value="3"] {background:#FFF1CA; color:#000; margin-top:-3px; padding-top:3px;} .icon[data-type="temp"].icon[data-value="4"] {background:#FFEDBA; color:#000; margin-top:-4px; padding-top:4px;} .icon[data-type="temp"].icon[data-value="5"] {background:#FFEAAC; color:#000; margin-top:-5px; padding-top:5px;} .icon[data-type="temp"].icon[data-value="6"] {background:#FFE59B; color:#000; margin-top:-6px; padding-top:6px;} .icon[data-type="temp"].icon[data-value="7"] {background:#FFE28D; color:#000; margin-top:-7px; padding-top:7px;} .icon[data-type="temp"].icon[data-value="8"] {background:#FFDE7D; color:#000; margin-top:-8px; padding-top:8px;} .icon[data-type="temp"].icon[data-value="9"] {background:#FFDA6D; color:#000; margin-top:-9px; padding-top:9px;} .icon[data-type="temp"].icon[data-value="10"] {background:#FFD765; color:#000; margin-top:-10px; padding-top:10px;} .icon[data-type="temp"].icon[data-value="11"] {background:#FFD262; color:#000; margin-top:-11px; padding-top:11px;} .icon[data-type="temp"].icon[data-value="12"] {background:#FFCC5F; color:#000; margin-top:-12px; padding-top:12px;} .icon[data-type="temp"].icon[data-value="13"] {background:#FFC75C; color:#000; margin-top:-13px; padding-top:13px;} .icon[data-type="temp"].icon[data-value="14"] {background:#FFC259; color:#000; margin-top:-14px; padding-top:14px;} .icon[data-type="temp"].icon[data-value="15"] {background:#FFBD56; color:#000; margin-top:-15px; padding-top:15px;} .icon[data-type="temp"].icon[data-value="16"] {background:#FFB853; color:#000; margin-top:-16px; padding-top:16px;} .icon[data-type="temp"].icon[data-value="17"] {background:#FFB350; color:#000; margin-top:-17px; padding-top:17px;} .icon[data-type="temp"].icon[data-value="18"] {background:#FFAD4D; color:#000; margin-top:-18px; padding-top:18px;} .icon[data-type="temp"].icon[data-value="19"] {background:#FFA84A; color:#000; margin-top:-19px; padding-top:19px;} .icon[data-type="temp"].icon[data-value="20"] {background:#FFA447; color:#000; margin-top:-20px; padding-top:20px;} .icon[data-type="temp"].icon[data-value="21"] {background:#FF9E44; color:#000; margin-top:-21px; padding-top:21px;} .icon[data-type="temp"].icon[data-value="22"] {background:#FF9942; color:#000; margin-top:-22px; padding-top:22px;} .icon[data-type="temp"].icon[data-value="23"] {background:#FF943E; color:#000; margin-top:-23px; padding-top:23px;} .icon[data-type="temp"].icon[data-value="24"] {background:#FF8F3B; color:#000; margin-top:-24px; padding-top:24px;} .icon[data-type="temp"].icon[data-value="25"] {background:#FF8A39; color:#000; margin-top:-25px; padding-top:25px;} .icon[data-type="temp"].icon[data-value="26"] {background:#FF8335; color:#000; margin-top:-26px; padding-top:26px;} .icon[data-type="temp"].icon[data-value="27"] {background:#FE7D33; color:#000; margin-top:-27px; padding-top:27px;} .icon[data-type="temp"].icon[data-value="28"] {background:#FA7433; color:#000; margin-top:-28px; padding-top:28px;} .icon[data-type="temp"].icon[data-value="29"] {background:#F86D33; color:#000; margin-top:-29px; padding-top:29px;} .icon[data-type="temp"].icon[data-value="30"] {background:#F36233; color:#fff; margin-top:-30px; padding-top:30px;} .icon[data-type="temp"].icon[data-value="31"] {background:#EF5733; color:#fff; margin-top:-31px; padding-top:31px;} .icon[data-type="temp"].icon[data-value="32"] {background:#EB4E33; color:#fff; margin-top:-32px; padding-top:32px;} .icon[data-type="temp"].icon[data-value="33"] {background:#E74433; color:#fff; margin-top:-33px; padding-top:33px;} .icon[data-type="temp"].icon[data-value="34"] {background:#E33A33; color:#fff; margin-top:-34px; padding-top:34px;} .icon[data-type="temp"].icon[data-value="35"] {background:#DE2E33; color:#fff; margin-top:-35px; padding-top:35px;} .icon[data-type="temp"].icon[data-value="36"] {background:#DA2433; color:#fff; margin-top:-36px; padding-top:36px;} .icon[data-type="temp"].icon[data-value="37"] {background:#D61933; color:#fff; margin-top:-37px; padding-top:37px;} .icon[data-type="temp"].icon[data-value="38"] {background:#D10D33; color:#fff; margin-top:-38px; padding-top:38px;} .icon[data-type="temp"].icon[data-value="39"] {background:#CD0333; color:#fff; margin-top:-39px; padding-top:39px;} .icon[data-type="temp"].icon[data-value="40"] {background:#C30031; color:#fff; margin-top:-40px; padding-top:40px;} .icon[data-type="temp"].icon[data-value="41"] {background:#B6002E; color:#fff; margin-top:-41px; padding-top:41px;} .icon[data-type="temp"].icon[data-value="42"] {background:#A40029; color:#fff; margin-top:-42px; padding-top:42px;} .icon[data-type="temp"].icon[data-value="43"] {background:#910024; color:#fff; margin-top:-43px; padding-top:43px;} .icon[data-type="temp"].icon[data-value="44"] {background:#820021; color:#fff; margin-top:-44px; padding-top:44px;} .icon[data-type="temp"].icon[data-value="45"] {background:#6F001C; color:#fff; margin-top:-45px; padding-top:45px;} .icon[data-type="temp"].icon[data-value="46"] {background:#5B0017; color:#fff; margin-top:-46px; padding-top:46px;} .icon[data-type="temp"].icon[data-value="47"] {background:#4E0014; color:#fff; margin-top:-47px; padding-top:47px;} .icon[data-type="temp"].icon[data-value="48"] {background:#3A000E; color:#fff; margin-top:-48px; padding-top:48px;} .icon[data-type="temp"].icon[data-value="49"] {background:#2B000B; color:#fff; margin-top:-49px; padding-top:49px;} .icon[data-type="temp"].icon[data-value="50"] {background:#1F0008; color:#fff; margin-top:-50px; padding-top:50px;} .icon[data-type="temp"].icon[data-value="51"] {background:#1F0008; color:#fff; margin-top:-51px; padding-top:51px;} .icon[data-type="temp"].icon[data-value="52"] {background:#1F0008; color:#fff; margin-top:-52px; padding-top:52px;} .icon[data-type="temp"].icon[data-value="53"] {background:#1F0008; color:#fff; margin-top:-53px; padding-top:53px;} .icon[data-type="temp"].icon[data-value="54"] {background:#1F0008; color:#fff; margin-top:-54px; padding-top:54px;} .icon[data-type="temp"].icon[data-value="55"] {background:#1F0008; color:#fff; margin-top:-55px; padding-top:55px;} .icon[data-type="temp"].icon[data-value="56"] {background:#1F0008; color:#fff; margin-top:-56px; padding-top:56px;} .icon[data-type="temp"].icon[data-value="57"] {background:#1F0008; color:#fff; margin-top:-57px; padding-top:57px;} .icon[data-type="temp"].icon[data-value="58"] {background:#1F0008; color:#fff; margin-top:-58px; padding-top:58px;} .icon[data-type="temp"].icon[data-value="59"] {background:#1F0008; color:#fff; margin-top:-59px; padding-top:59px;} .icon[data-type="temp"].icon[data-value="60"] {background:#1F0008; color:#fff; margin-top:-60px; padding-top:60px;} /*set padding on element(s) that hold the temp values */ tr[data-min="-60"] td {padding-bottom:60px;} tr[data-min="-59"] td {padding-bottom:59px;} tr[data-min="-58"] td {padding-bottom:58px;} tr[data-min="-57"] td {padding-bottom:57px;} tr[data-min="-56"] td {padding-bottom:56px;} tr[data-min="-55"] td {padding-bottom:55px;} tr[data-min="-54"] td {padding-bottom:54px;} tr[data-min="-53"] td {padding-bottom:53px;} tr[data-min="-52"] td {padding-bottom:52px;} tr[data-min="-51"] td {padding-bottom:51px;} tr[data-min="-50"] td {padding-bottom:50px;} tr[data-min="-49"] td {padding-bottom:49px;} tr[data-min="-48"] td {padding-bottom:48px;} tr[data-min="-47"] td {padding-bottom:47px;} tr[data-min="-46"] td {padding-bottom:46px;} tr[data-min="-45"] td {padding-bottom:45px;} tr[data-min="-44"] td {padding-bottom:44px;} tr[data-min="-43"] td {padding-bottom:43px;} tr[data-min="-42"] td {padding-bottom:42px;} tr[data-min="-41"] td {padding-bottom:41px;} tr[data-min="-40"] td {padding-bottom:40px;} tr[data-min="-39"] td {padding-bottom:39px;} tr[data-min="-38"] td {padding-bottom:38px;} tr[data-min="-37"] td {padding-bottom:37px;} tr[data-min="-36"] td {padding-bottom:36px;} tr[data-min="-35"] td {padding-bottom:35px;} tr[data-min="-34"] td {padding-bottom:34px;} tr[data-min="-33"] td {padding-bottom:33px;} tr[data-min="-32"] td {padding-bottom:32px;} tr[data-min="-31"] td {padding-bottom:31px;} tr[data-min="-30"] td {padding-bottom:30px;} tr[data-min="-29"] td {padding-bottom:29px;} tr[data-min="-28"] td {padding-bottom:28px;} tr[data-min="-27"] td {padding-bottom:27px;} tr[data-min="-26"] td {padding-bottom:26px;} tr[data-min="-25"] td {padding-bottom:25px;} tr[data-min="-24"] td {padding-bottom:24px;} tr[data-min="-23"] td {padding-bottom:23px;} tr[data-min="-22"] td {padding-bottom:22px;} tr[data-min="-21"] td {padding-bottom:21px;} tr[data-min="-20"] td {padding-bottom:20px;} tr[data-min="-19"] td {padding-bottom:19px;} tr[data-min="-18"] td {padding-bottom:18px;} tr[data-min="-17"] td {padding-bottom:17px;} tr[data-min="-16"] td {padding-bottom:16px;} tr[data-min="-15"] td {padding-bottom:15px;} tr[data-min="-14"] td {padding-bottom:14px;} tr[data-min="-13"] td {padding-bottom:13px;} tr[data-min="-12"] td {padding-bottom:12px;} tr[data-min="-11"] td {padding-bottom:11px;} tr[data-min="-10"] td {padding-bottom:10px;} tr[data-min="-9"] td {padding-bottom:9px;} tr[data-min="-8"] td {padding-bottom:8px;} tr[data-min="-7"] td {padding-bottom:7px;} tr[data-min="-6"] td {padding-bottom:6px;} tr[data-min="-5"] td {padding-bottom:5px;} tr[data-min="-4"] td {padding-bottom:4px;} tr[data-min="-3"] td {padding-bottom:3px;} tr[data-min="-2"] td {padding-bottom:2px;} tr[data-min="-1"] td {padding-bottom:1px;} tr[data-min="0"] td {padding-bottom:0;} tr[data-max="0"] td {padding-top:0;} tr[data-max="1"] td {padding-top:1px;} tr[data-max="2"] td {padding-top:2px;} tr[data-max="3"] td {padding-top:3px;} tr[data-max="4"] td {padding-top:4px;} tr[data-max="5"] td {padding-top:5px;} tr[data-max="6"] td {padding-top:6px;} tr[data-max="7"] td {padding-top:7px;} tr[data-max="8"] td {padding-top:8px;} tr[data-max="9"] td {padding-top:9px;} tr[data-max="10"] td {padding-top:10px;} tr[data-max="11"] td {padding-top:11px;} tr[data-max="12"] td {padding-top:12px;} tr[data-max="13"] td {padding-top:13px;} tr[data-max="14"] td {padding-top:14px;} tr[data-max="15"] td {padding-top:15px;} tr[data-max="16"] td {padding-top:16px;} tr[data-max="17"] td {padding-top:17px;} tr[data-max="18"] td {padding-top:18px;} tr[data-max="19"] td {padding-top:19px;} tr[data-max="20"] td {padding-top:20px;} tr[data-max="21"] td {padding-top:21px;} tr[data-max="22"] td {padding-top:22px;} tr[data-max="23"] td {padding-top:23px;} tr[data-max="24"] td {padding-top:24px;} tr[data-max="25"] td {padding-top:25px;} tr[data-max="26"] td {padding-top:26px;} tr[data-max="27"] td {padding-top:27px;} tr[data-max="28"] td {padding-top:28px;} tr[data-max="29"] td {padding-top:29px;} tr[data-max="30"] td {padding-top:30px;} tr[data-max="31"] td {padding-top:31px;} tr[data-max="32"] td {padding-top:32px;} tr[data-max="33"] td {padding-top:33px;} tr[data-max="34"] td {padding-top:34px;} tr[data-max="35"] td {padding-top:35px;} tr[data-max="36"] td {padding-top:36px;} tr[data-max="37"] td {padding-top:37px;} tr[data-max="38"] td {padding-top:38px;} tr[data-max="39"] td {padding-top:39px;} tr[data-max="40"] td {padding-top:40px;} tr[data-max="41"] td {padding-top:41px;} tr[data-max="42"] td {padding-top:42px;} tr[data-max="43"] td {padding-top:43px;} tr[data-max="44"] td {padding-top:44px;} tr[data-max="45"] td {padding-top:45px;} tr[data-max="46"] td {padding-top:46px;} tr[data-max="47"] td {padding-top:47px;} tr[data-max="48"] td {padding-top:48px;} tr[data-max="49"] td {padding-top:49px;} tr[data-max="50"] td {padding-top:50px;} tr[data-max="51"] td {padding-top:51px;} tr[data-max="52"] td {padding-top:52px;} tr[data-max="53"] td {padding-top:53px;} tr[data-max="54"] td {padding-top:54px;} tr[data-max="55"] td {padding-top:55px;} tr[data-max="56"] td {padding-top:56px;} tr[data-max="57"] td {padding-top:57px;} tr[data-max="58"] td {padding-top:58px;} tr[data-max="59"] td {padding-top:59px;} tr[data-max="60"] td {padding-top:60px;} .icon-symbol[data-type="temp"]{ width: 20px; height: 20px; border: 1px solid; border-radius: 3px; margin: 0!important; padding: 1px!important; } .icon-animated[data-type="temp"].icon[data-value="-60"] {margin-bottom:-60px; padding-bottom:60px;} .icon-animated[data-type="temp"].icon[data-value="-59"] {margin-bottom:-59px; padding-bottom:59px;} .icon-animated[data-type="temp"].icon[data-value="-58"] {margin-bottom:-58px; padding-bottom:58px;} .icon-animated[data-type="temp"].icon[data-value="-57"] {margin-bottom:-57px; padding-bottom:57px;} .icon-animated[data-type="temp"].icon[data-value="-56"] {margin-bottom:-56px; padding-bottom:56px;} .icon-animated[data-type="temp"].icon[data-value="-55"] {margin-bottom:-55px; padding-bottom:55px;} .icon-animated[data-type="temp"].icon[data-value="-54"] {margin-bottom:-54px; padding-bottom:54px;} .icon-animated[data-type="temp"].icon[data-value="-53"] {margin-bottom:-53px; padding-bottom:53px;} .icon-animated[data-type="temp"].icon[data-value="-52"] {margin-bottom:-52px; padding-bottom:52px;} .icon-animated[data-type="temp"].icon[data-value="-51"] {margin-bottom:-51px; padding-bottom:51px;} .icon-animated[data-type="temp"].icon[data-value="-50"] {margin-bottom:-50px; padding-bottom:50px;} .icon-animated[data-type="temp"].icon[data-value="-49"] {margin-bottom:-49px; padding-bottom:49px;} .icon-animated[data-type="temp"].icon[data-value="-48"] {margin-bottom:-48px; padding-bottom:48px;} .icon-animated[data-type="temp"].icon[data-value="-47"] {margin-bottom:-47px; padding-bottom:47px;} .icon-animated[data-type="temp"].icon[data-value="-46"] {margin-bottom:-46px; padding-bottom:46px;} .icon-animated[data-type="temp"].icon[data-value="-45"] {margin-bottom:-45px; padding-bottom:45px;} .icon-animated[data-type="temp"].icon[data-value="-44"] {margin-bottom:-44px; padding-bottom:44px;} .icon-animated[data-type="temp"].icon[data-value="-43"] {margin-bottom:-43px; padding-bottom:43px;} .icon-animated[data-type="temp"].icon[data-value="-42"] {margin-bottom:-42px; padding-bottom:42px;} .icon-animated[data-type="temp"].icon[data-value="-41"] {margin-bottom:-41px; padding-bottom:41px;} .icon-animated[data-type="temp"].icon[data-value="-40"] {margin-bottom:-40px; padding-bottom:40px;} .icon-animated[data-type="temp"].icon[data-value="-39"] {margin-bottom:-39px; padding-bottom:39px;} .icon-animated[data-type="temp"].icon[data-value="-38"] {margin-bottom:-38px; padding-bottom:38px;} .icon-animated[data-type="temp"].icon[data-value="-37"] {margin-bottom:-37px; padding-bottom:37px;} .icon-animated[data-type="temp"].icon[data-value="-36"] {margin-bottom:-36px; padding-bottom:36px;} .icon-animated[data-type="temp"].icon[data-value="-35"] {margin-bottom:-35px; padding-bottom:35px;} .icon-animated[data-type="temp"].icon[data-value="-34"] {margin-bottom:-34px; padding-bottom:34px;} .icon-animated[data-type="temp"].icon[data-value="-33"] {margin-bottom:-33px; padding-bottom:33px;} .icon-animated[data-type="temp"].icon[data-value="-32"] {margin-bottom:-32px; padding-bottom:32px;} .icon-animated[data-type="temp"].icon[data-value="-31"] {margin-bottom:-31px; padding-bottom:31px;} .icon-animated[data-type="temp"].icon[data-value="-30"] {margin-bottom:-30px; padding-bottom:30px;} .icon-animated[data-type="temp"].icon[data-value="-29"] {margin-bottom:-29px; padding-bottom:29px;} .icon-animated[data-type="temp"].icon[data-value="-28"] {margin-bottom:-28px; padding-bottom:28px;} .icon-animated[data-type="temp"].icon[data-value="-27"] {margin-bottom:-27px; padding-bottom:27px;} .icon-animated[data-type="temp"].icon[data-value="-26"] {margin-bottom:-26px; padding-bottom:26px;} .icon-animated[data-type="temp"].icon[data-value="-25"] {margin-bottom:-25px; padding-bottom:25px;} .icon-animated[data-type="temp"].icon[data-value="-24"] {margin-bottom:-24px; padding-bottom:24px;} .icon-animated[data-type="temp"].icon[data-value="-23"] {margin-bottom:-23px; padding-bottom:23px;} .icon-animated[data-type="temp"].icon[data-value="-22"] {margin-bottom:-22px; padding-bottom:22px;} .icon-animated[data-type="temp"].icon[data-value="-21"] {margin-bottom:-21px; padding-bottom:21px;} .icon-animated[data-type="temp"].icon[data-value="-20"] {margin-bottom:-20px; padding-bottom:20px;} .icon-animated[data-type="temp"].icon[data-value="-19"] {margin-bottom:-19px; padding-bottom:19px;} .icon-animated[data-type="temp"].icon[data-value="-18"] {margin-bottom:-18px; padding-bottom:18px;} .icon-animated[data-type="temp"].icon[data-value="-17"] {margin-bottom:-17px; padding-bottom:17px;} .icon-animated[data-type="temp"].icon[data-value="-16"] {margin-bottom:-16px; padding-bottom:16px;} .icon-animated[data-type="temp"].icon[data-value="-15"] {margin-bottom:-15px; padding-bottom:15px;} .icon-animated[data-type="temp"].icon[data-value="-14"] {margin-bottom:-14px; padding-bottom:14px;} .icon-animated[data-type="temp"].icon[data-value="-13"] {margin-bottom:-13px; padding-bottom:13px;} .icon-animated[data-type="temp"].icon[data-value="-12"] {margin-bottom:-12px; padding-bottom:12px;} .icon-animated[data-type="temp"].icon[data-value="-11"] {margin-bottom:-11px; padding-bottom:11px;} .icon-animated[data-type="temp"].icon[data-value="-10"] {margin-bottom:-10px; padding-bottom:10px;} .icon-animated[data-type="temp"].icon[data-value="-9"] {margin-bottom:-9px; padding-bottom:9px;} .icon-animated[data-type="temp"].icon[data-value="-8"] {margin-bottom:-8px; padding-bottom:8px;} .icon-animated[data-type="temp"].icon[data-value="-7"] {margin-bottom:-7px; padding-bottom:7px;} .icon-animated[data-type="temp"].icon[data-value="-6"] {margin-bottom:-6px; padding-bottom:6px;} .icon-animated[data-type="temp"].icon[data-value="-5"] {margin-bottom:-5px; padding-bottom:5px;} .icon-animated[data-type="temp"].icon[data-value="-4"] {margin-bottom:-4px; padding-bottom:4px;} .icon-animated[data-type="temp"].icon[data-value="-3"] {margin-bottom:-3px; padding-bottom:3px;} .icon-animated[data-type="temp"].icon[data-value="-2"] {margin-bottom:-2px; padding-bottom:2px;} .icon-animated[data-type="temp"].icon[data-value="-1"] {margin-bottom:-1px; padding-bottom:1px;} .icon-animated[data-type="temp"].icon[data-value="0"] {margin:0; padding:0;} .icon-animated[data-type="temp"].icon[data-value="1"] {margin-top:-1px; padding-top:1px;} .icon-animated[data-type="temp"].icon[data-value="2"] {margin-top:-2px; padding-top:2px;} .icon-animated[data-type="temp"].icon[data-value="3"] {margin-top:-3px; padding-top:3px;} .icon-animated[data-type="temp"].icon[data-value="4"] {margin-top:-4px; padding-top:4px;} .icon-animated[data-type="temp"].icon[data-value="5"] {margin-top:-5px; padding-top:5px;} .icon-animated[data-type="temp"].icon[data-value="6"] {margin-top:-6px; padding-top:6px;} .icon-animated[data-type="temp"].icon[data-value="7"] {margin-top:-7px; padding-top:7px;} .icon-animated[data-type="temp"].icon[data-value="8"] {margin-top:-8px; padding-top:8px;} .icon-animated[data-type="temp"].icon[data-value="9"] {margin-top:-9px; padding-top:9px;} .icon-animated[data-type="temp"].icon[data-value="10"] {margin-top:-10px; padding-top:10px;} .icon-animated[data-type="temp"].icon[data-value="11"] {margin-top:-11px; padding-top:11px;} .icon-animated[data-type="temp"].icon[data-value="12"] {margin-top:-12px; padding-top:12px;} .icon-animated[data-type="temp"].icon[data-value="13"] {margin-top:-13px; padding-top:13px;} .icon-animated[data-type="temp"].icon[data-value="14"] {margin-top:-14px; padding-top:14px;} .icon-animated[data-type="temp"].icon[data-value="15"] {margin-top:-15px; padding-top:15px;} .icon-animated[data-type="temp"].icon[data-value="16"] {margin-top:-16px; padding-top:16px;} .icon-animated[data-type="temp"].icon[data-value="17"] {margin-top:-17px; padding-top:17px;} .icon-animated[data-type="temp"].icon[data-value="18"] {margin-top:-18px; padding-top:18px;} .icon-animated[data-type="temp"].icon[data-value="19"] {margin-top:-19px; padding-top:19px;} .icon-animated[data-type="temp"].icon[data-value="20"] {margin-top:-20px; padding-top:20px;} .icon-animated[data-type="temp"].icon[data-value="21"] {margin-top:-21px; padding-top:21px;} .icon-animated[data-type="temp"].icon[data-value="22"] {margin-top:-22px; padding-top:22px;} .icon-animated[data-type="temp"].icon[data-value="23"] {margin-top:-23px; padding-top:23px;} .icon-animated[data-type="temp"].icon[data-value="24"] {margin-top:-24px; padding-top:24px;} .icon-animated[data-type="temp"].icon[data-value="25"] {margin-top:-25px; padding-top:25px;} .icon-animated[data-type="temp"].icon[data-value="26"] {margin-top:-26px; padding-top:26px;} .icon-animated[data-type="temp"].icon[data-value="27"] {margin-top:-27px; padding-top:27px;} .icon-animated[data-type="temp"].icon[data-value="28"] {margin-top:-28px; padding-top:28px;} .icon-animated[data-type="temp"].icon[data-value="29"] {margin-top:-29px; padding-top:29px;} .icon-animated[data-type="temp"].icon[data-value="30"] {margin-top:-30px; padding-top:30px;} .icon-animated[data-type="temp"].icon[data-value="31"] {margin-top:-31px; padding-top:31px;} .icon-animated[data-type="temp"].icon[data-value="32"] {margin-top:-32px; padding-top:32px;} .icon-animated[data-type="temp"].icon[data-value="33"] {margin-top:-33px; padding-top:33px;} .icon-animated[data-type="temp"].icon[data-value="34"] {margin-top:-34px; padding-top:34px;} .icon-animated[data-type="temp"].icon[data-value="35"] {margin-top:-35px; padding-top:35px;} .icon-animated[data-type="temp"].icon[data-value="36"] {margin-top:-36px; padding-top:36px;} .icon-animated[data-type="temp"].icon[data-value="37"] {margin-top:-37px; padding-top:37px;} .icon-animated[data-type="temp"].icon[data-value="38"] {margin-top:-38px; padding-top:38px;} .icon-animated[data-type="temp"].icon[data-value="39"] {margin-top:-39px; padding-top:39px;} .icon-animated[data-type="temp"].icon[data-value="40"] {margin-top:-40px; padding-top:40px;} .icon-animated[data-type="temp"].icon[data-value="41"] {margin-top:-41px; padding-top:41px;} .icon-animated[data-type="temp"].icon[data-value="42"] {margin-top:-42px; padding-top:42px;} .icon-animated[data-type="temp"].icon[data-value="43"] {margin-top:-43px; padding-top:43px;} .icon-animated[data-type="temp"].icon[data-value="44"] {margin-top:-44px; padding-top:44px;} .icon-animated[data-type="temp"].icon[data-value="45"] {margin-top:-45px; padding-top:45px;} .icon-animated[data-type="temp"].icon[data-value="46"] {margin-top:-46px; padding-top:46px;} .icon-animated[data-type="temp"].icon[data-value="47"] {margin-top:-47px; padding-top:47px;} .icon-animated[data-type="temp"].icon[data-value="48"] {margin-top:-48px; padding-top:48px;} .icon-animated[data-type="temp"].icon[data-value="49"] {margin-top:-49px; padding-top:49px;} .icon-animated[data-type="temp"].icon[data-value="50"] {margin-top:-50px; padding-top:50px;} .icon-animated[data-type="temp"].icon[data-value="51"] {margin-top:-51px; padding-top:51px;} .icon-animated[data-type="temp"].icon[data-value="52"] {margin-top:-52px; padding-top:52px;} .icon-animated[data-type="temp"].icon[data-value="53"] {margin-top:-53px; padding-top:53px;} .icon-animated[data-type="temp"].icon[data-value="54"] {margin-top:-54px; padding-top:54px;} .icon-animated[data-type="temp"].icon[data-value="55"] {margin-top:-55px; padding-top:55px;} .icon-animated[data-type="temp"].icon[data-value="56"] {margin-top:-56px; padding-top:56px;} .icon-animated[data-type="temp"].icon[data-value="57"] {margin-top:-57px; padding-top:57px;} .icon-animated[data-type="temp"].icon[data-value="58"] {margin-top:-58px; padding-top:58px;} .icon-animated[data-type="temp"].icon[data-value="59"] {margin-top:-59px; padding-top:59px;} .icon-animated[data-type="temp"].icon[data-value="60"] {margin-top:-60px; padding-top:60px;} /*set padding on element(s) that hold the temp values */ #weatherHolder [data-min="-60"] td {padding-bottom:60px;} #weatherHolder [data-min="-59"] td {padding-bottom:59px;} #weatherHolder [data-min="-58"] td {padding-bottom:58px;} #weatherHolder [data-min="-57"] td {padding-bottom:57px;} #weatherHolder [data-min="-56"] td {padding-bottom:56px;} #weatherHolder [data-min="-55"] td {padding-bottom:55px;} #weatherHolder [data-min="-54"] td {padding-bottom:54px;} #weatherHolder [data-min="-53"] td {padding-bottom:53px;} #weatherHolder [data-min="-52"] td {padding-bottom:52px;} #weatherHolder [data-min="-51"] td {padding-bottom:51px;} #weatherHolder [data-min="-50"] td {padding-bottom:50px;} #weatherHolder [data-min="-49"] td {padding-bottom:49px;} #weatherHolder [data-min="-48"] td {padding-bottom:48px;} #weatherHolder [data-min="-47"] td {padding-bottom:47px;} #weatherHolder [data-min="-46"] td {padding-bottom:46px;} #weatherHolder [data-min="-45"] td {padding-bottom:45px;} #weatherHolder [data-min="-44"] td {padding-bottom:44px;} #weatherHolder [data-min="-43"] td {padding-bottom:43px;} #weatherHolder [data-min="-42"] td {padding-bottom:42px;} #weatherHolder [data-min="-41"] td {padding-bottom:41px;} #weatherHolder [data-min="-40"] td {padding-bottom:40px;} #weatherHolder [data-min="-39"] td {padding-bottom:39px;} #weatherHolder [data-min="-38"] td {padding-bottom:38px;} #weatherHolder [data-min="-37"] td {padding-bottom:37px;} #weatherHolder [data-min="-36"] td {padding-bottom:36px;} #weatherHolder [data-min="-35"] td {padding-bottom:35px;} #weatherHolder [data-min="-34"] td {padding-bottom:34px;} #weatherHolder [data-min="-33"] td {padding-bottom:33px;} #weatherHolder [data-min="-32"] td {padding-bottom:32px;} #weatherHolder [data-min="-31"] td {padding-bottom:31px;} #weatherHolder [data-min="-30"] td {padding-bottom:30px;} #weatherHolder [data-min="-29"] td {padding-bottom:29px;} #weatherHolder [data-min="-28"] td {padding-bottom:28px;} #weatherHolder [data-min="-27"] td {padding-bottom:27px;} #weatherHolder [data-min="-26"] td {padding-bottom:26px;} #weatherHolder [data-min="-25"] td {padding-bottom:25px;} #weatherHolder [data-min="-24"] td {padding-bottom:24px;} #weatherHolder [data-min="-23"] td {padding-bottom:23px;} #weatherHolder [data-min="-22"] td {padding-bottom:22px;} #weatherHolder [data-min="-21"] td {padding-bottom:21px;} #weatherHolder [data-min="-20"] td {padding-bottom:20px;} #weatherHolder [data-min="-19"] td {padding-bottom:19px;} #weatherHolder [data-min="-18"] td {padding-bottom:18px;} #weatherHolder [data-min="-17"] td {padding-bottom:17px;} #weatherHolder [data-min="-16"] td {padding-bottom:16px;} #weatherHolder [data-min="-15"] td {padding-bottom:15px;} #weatherHolder [data-min="-14"] td {padding-bottom:14px;} #weatherHolder [data-min="-13"] td {padding-bottom:13px;} #weatherHolder [data-min="-12"] td {padding-bottom:12px;} #weatherHolder [data-min="-11"] td {padding-bottom:11px;} #weatherHolder [data-min="-10"] td {padding-bottom:10px;} #weatherHolder [data-min="-9"] td {padding-bottom:9px;} #weatherHolder [data-min="-8"] td {padding-bottom:8px;} #weatherHolder [data-min="-7"] td {padding-bottom:7px;} #weatherHolder [data-min="-6"] td {padding-bottom:6px;} #weatherHolder [data-min="-5"] td {padding-bottom:5px;} #weatherHolder [data-min="-4"] td {padding-bottom:4px;} #weatherHolder [data-min="-3"] td {padding-bottom:3px;} #weatherHolder [data-min="-2"] td {padding-bottom:2px;} #weatherHolder [data-min="-1"] td {padding-bottom:1px;} #weatherHolder [data-min="0"] td {padding-bottom:0;} #weatherHolder [data-max="0"] td {padding-top:0;} #weatherHolder [data-max="1"] td {padding-top:1px;} #weatherHolder [data-max="2"] td {padding-top:2px;} #weatherHolder [data-max="3"] td {padding-top:3px;} #weatherHolder [data-max="4"] td {padding-top:4px;} #weatherHolder [data-max="5"] td {padding-top:5px;} #weatherHolder [data-max="6"] td {padding-top:6px;} #weatherHolder [data-max="7"] td {padding-top:7px;} #weatherHolder [data-max="8"] td {padding-top:8px;} #weatherHolder [data-max="9"] td {padding-top:9px;} #weatherHolder [data-max="10"] td {padding-top:10px;} #weatherHolder [data-max="11"] td {padding-top:11px;} #weatherHolder [data-max="12"] td {padding-top:12px;} #weatherHolder [data-max="13"] td {padding-top:13px;} #weatherHolder [data-max="14"] td {padding-top:14px;} #weatherHolder [data-max="15"] td {padding-top:15px;} #weatherHolder [data-max="16"] td {padding-top:16px;} #weatherHolder [data-max="17"] td {padding-top:17px;} #weatherHolder [data-max="18"] td {padding-top:18px;} #weatherHolder [data-max="19"] td {padding-top:19px;} #weatherHolder [data-max="20"] td {padding-top:20px;} #weatherHolder [data-max="21"] td {padding-top:21px;} #weatherHolder [data-max="22"] td {padding-top:22px;} #weatherHolder [data-max="23"] td {padding-top:23px;} #weatherHolder [data-max="24"] td {padding-top:24px;} #weatherHolder [data-max="25"] td {padding-top:25px;} #weatherHolder [data-max="26"] td {padding-top:26px;} #weatherHolder [data-max="27"] td {padding-top:27px;} #weatherHolder [data-max="28"] td {padding-top:28px;} #weatherHolder [data-max="29"] td {padding-top:29px;} #weatherHolder [data-max="30"] td {padding-top:30px;} #weatherHolder [data-max="31"] td {padding-top:31px;} #weatherHolder [data-max="32"] td {padding-top:32px;} #weatherHolder [data-max="33"] td {padding-top:33px;} #weatherHolder [data-max="34"] td {padding-top:34px;} #weatherHolder [data-max="35"] td {padding-top:35px;} #weatherHolder [data-max="36"] td {padding-top:36px;} #weatherHolder [data-max="37"] td {padding-top:37px;} #weatherHolder [data-max="38"] td {padding-top:38px;} #weatherHolder [data-max="39"] td {padding-top:39px;} #weatherHolder [data-max="40"] td {padding-top:40px;} #weatherHolder [data-max="41"] td {padding-top:41px;} #weatherHolder [data-max="42"] td {padding-top:42px;} #weatherHolder [data-max="43"] td {padding-top:43px;} #weatherHolder [data-max="44"] td {padding-top:44px;} #weatherHolder [data-max="45"] td {padding-top:45px;} #weatherHolder [data-max="46"] td {padding-top:46px;} #weatherHolder [data-max="47"] td {padding-top:47px;} #weatherHolder [data-max="48"] td {padding-top:48px;} #weatherHolder [data-max="49"] td {padding-top:49px;} #weatherHolder [data-max="50"] td {padding-top:50px;} #weatherHolder [data-max="51"] td {padding-top:51px;} #weatherHolder [data-max="52"] td {padding-top:52px;} #weatherHolder [data-max="53"] td {padding-top:53px;} #weatherHolder [data-max="54"] td {padding-top:54px;} #weatherHolder [data-max="55"] td {padding-top:55px;} #weatherHolder [data-max="56"] td {padding-top:56px;} #weatherHolder [data-max="57"] td {padding-top:57px;} #weatherHolder [data-max="58"] td {padding-top:58px;} #weatherHolder [data-max="59"] td {padding-top:59px;} #weatherHolder [data-max="60"] td {padding-top:60px;} /* high contrast temperature symbols */ /* <= 0 #CBCBFE // blue for 0 and less <= 20 #FEFE65 // yellow for 1-20 #FE9832 // orange for 21+ */ .altTemp .icon[data-type="temp"].icon[data-value^="-"], .altTemp .icon[data-type="temp"].icon[data-value="0"] {background:#CBCBFE; color:#000;} .altTemp .icon[data-type="temp"].icon[data-value="1"], .altTemp .icon[data-type="temp"].icon[data-value="2"], .altTemp .icon[data-type="temp"].icon[data-value="3"], .altTemp .icon[data-type="temp"].icon[data-value="4"], .altTemp .icon[data-type="temp"].icon[data-value="5"], .altTemp .icon[data-type="temp"].icon[data-value="6"], .altTemp .icon[data-type="temp"].icon[data-value="7"], .altTemp .icon[data-type="temp"].icon[data-value="8"], .altTemp .icon[data-type="temp"].icon[data-value="9"], .altTemp .icon[data-type="temp"].icon[data-value="10"], .altTemp .icon[data-type="temp"].icon[data-value="11"], .altTemp .icon[data-type="temp"].icon[data-value="12"], .altTemp .icon[data-type="temp"].icon[data-value="13"], .altTemp .icon[data-type="temp"].icon[data-value="14"], .altTemp .icon[data-type="temp"].icon[data-value="15"], .altTemp .icon[data-type="temp"].icon[data-value="16"], .altTemp .icon[data-type="temp"].icon[data-value="17"], .altTemp .icon[data-type="temp"].icon[data-value="18"], .altTemp .icon[data-type="temp"].icon[data-value="19"], .altTemp .icon[data-type="temp"].icon[data-value="20"] {background:#FEFE65; color:#000;} .altTemp .icon[data-type="temp"].icon[data-value="21"], .altTemp .icon[data-type="temp"].icon[data-value="22"], .altTemp .icon[data-type="temp"].icon[data-value="23"], .altTemp .icon[data-type="temp"].icon[data-value="24"], .altTemp .icon[data-type="temp"].icon[data-value="25"], .altTemp .icon[data-type="temp"].icon[data-value="26"], .altTemp .icon[data-type="temp"].icon[data-value="27"], .altTemp .icon[data-type="temp"].icon[data-value="28"], .altTemp .icon[data-type="temp"].icon[data-value="29"], .altTemp .icon[data-type="temp"].icon[data-value="30"], .altTemp .icon[data-type="temp"].icon[data-value="31"], .altTemp .icon[data-type="temp"].icon[data-value="32"], .altTemp .icon[data-type="temp"].icon[data-value="33"], .altTemp .icon[data-type="temp"].icon[data-value="34"], .altTemp .icon[data-type="temp"].icon[data-value="35"], .altTemp .icon[data-type="temp"].icon[data-value="36"], .altTemp .icon[data-type="temp"].icon[data-value="37"], .altTemp .icon[data-type="temp"].icon[data-value="38"], .altTemp .icon[data-type="temp"].icon[data-value="39"], .altTemp .icon[data-type="temp"].icon[data-value="40"], .altTemp .icon[data-type="temp"].icon[data-value="41"], .altTemp .icon[data-type="temp"].icon[data-value="42"], .altTemp .icon[data-type="temp"].icon[data-value="43"], .altTemp .icon[data-type="temp"].icon[data-value="44"], .altTemp .icon[data-type="temp"].icon[data-value="45"], .altTemp .icon[data-type="temp"].icon[data-value="46"], .altTemp .icon[data-type="temp"].icon[data-value="47"], .altTemp .icon[data-type="temp"].icon[data-value="48"], .altTemp .icon[data-type="temp"].icon[data-value="49"], .altTemp .icon[data-type="temp"].icon[data-value="50"], .altTemp .icon[data-type="temp"].icon[data-value="51"], .altTemp .icon[data-type="temp"].icon[data-value="52"], .altTemp .icon[data-type="temp"].icon[data-value="53"], .altTemp .icon[data-type="temp"].icon[data-value="54"], .altTemp .icon[data-type="temp"].icon[data-value="55"], .altTemp .icon[data-type="temp"].icon[data-value="56"], .altTemp .icon[data-type="temp"].icon[data-value="57"], .altTemp .icon[data-type="temp"].icon[data-value="58"], .altTemp .icon[data-type="temp"].icon[data-value="59"], .altTemp .icon[data-type="temp"].icon[data-value="60"] {background:#FE9832; color:#000;} /* =icon (temp - colours animation) -------------------------------------------------------*/ @-webkit-keyframes tempResize { 0% {background:none; padding:0; margin:0;} } @keyframes tempResize { 0% {background:none; padding:0; margin:0;} } @-webkit-keyframes tempFade { 0% {color:transparent;} } @keyframes tempFade { 0% {color:transparent;} } .icon-animated[data-type="temp"] { -webkit-animation-name:tempResize, tempFade; -webkit-animation-fill-mode:none, backwards; -webkit-animation-duration:0.8s, 0.2s; -webkit-animation-iteration-count:1; -webkit-animation-timing-function:ease-out; -webkit-animation-delay:0, 0.8s; animation-name:tempResize, tempFade; animation-fill-mode:none, backwards; animation-duration:0.8s, 0.2s; animation-iteration-count:1; animation-timing-function:ease-out; animation-delay:0, 0.8s; } /* =icon (utilities) -------------------------------------------------------*/ .icon[data-type="utility"] { background:url(../images/icons/utility_1.svg) no-repeat 4em 21em; -webkit-background-size:4em 21em; -o-background-size:4em 21em; -moz-background-size:4em 21em; background-size:4em 21em; height:1em; width:1em; } .icon[data-type="utility"].icon[data-img="png"] {background-image:url(../images/icons/utility_1.png);} /* .png alternative */ /* crosshair */ .icon[data-type="utility"].icon[data-value="crosshair"].icon[data-color="blue"] {background-position:0 0;} .icon[data-type="utility"].icon[data-value="crosshair"].icon[data-color="black"] {background-position:-1em 0;} .icon[data-type="utility"].icon[data-value="crosshair"].icon[data-color="grey"] {background-position:-2em 0;} .icon[data-type="utility"].icon[data-value="crosshair"].icon[data-color="white"] {background-position:-3em 0;} /* magnify */ .icon[data-type="utility"].icon[data-value="magnify"].icon[data-color="blue"] {background-position:0 -1em;} .icon[data-type="utility"].icon[data-value="magnify"].icon[data-color="black"] {background-position:-1em -1em;} .icon[data-type="utility"].icon[data-value="magnify"].icon[data-color="grey"] {background-position:-2em -1em;} .icon[data-type="utility"].icon[data-value="magnify"].icon[data-color="white"] {background-position:-3em -1em;} /* nav */ .icon[data-type="utility"].icon[data-value="nav"].icon[data-color="blue"] {background-position:0 -2em;} .icon[data-type="utility"].icon[data-value="nav"].icon[data-color="black"] {background-position:-1em -2em;} .icon[data-type="utility"].icon[data-value="nav"].icon[data-color="grey"] {background-position:-2em -2em;} .icon[data-type="utility"].icon[data-value="nav"].icon[data-color="white"] {background-position:-3em -2em;} /* add */ .icon[data-type="utility"].icon[data-value="add"].icon[data-color="blue"] {background-position:0 -3em;} .icon[data-type="utility"].icon[data-value="add"].icon[data-color="black"] {background-position:-1em -3em;} .icon[data-type="utility"].icon[data-value="add"].icon[data-color="grey"] {background-position:-2em -3em;} .icon[data-type="utility"].icon[data-value="add"].icon[data-color="white"] {background-position:-3em -3em;} /* remove */ .icon[data-type="utility"].icon[data-value="remove"].icon[data-color="blue"] {background-position:0 -4em;} .icon[data-type="utility"].icon[data-value="remove"].icon[data-color="black"] {background-position:-1em -4em;} .icon[data-type="utility"].icon[data-value="remove"].icon[data-color="grey"] {background-position:-2em -4em;} .icon[data-type="utility"].icon[data-value="remove"].icon[data-color="white"] {background-position:-3em -4em;} /* tick */ .icon[data-type="utility"].icon[data-value="tick"].icon[data-color="blue"] {background-position:0 -5em;} .icon[data-type="utility"].icon[data-value="tick"].icon[data-color="black"] {background-position:-1em -5em;} .icon[data-type="utility"].icon[data-value="tick"].icon[data-color="grey"] {background-position:-2em -5em;} .icon[data-type="utility"].icon[data-value="tick"].icon[data-color="white"] {background-position:-3em -5em;} /* cross */ .icon[data-type="utility"].icon[data-value="cross"].icon[data-color="blue"] {background-position:0 -6em;} .icon[data-type="utility"].icon[data-value="cross"].icon[data-color="black"] {background-position:-1em -6em;} .icon[data-type="utility"].icon[data-value="cross"].icon[data-color="grey"] {background-position:-2em -6em;} .icon[data-type="utility"].icon[data-value="cross"].icon[data-color="white"] {background-position:-3em -6em;} /* arrow-up */ .icon[data-type="utility"].icon[data-value="arrow-up"].icon[data-color="blue"] {background-position:0 -7em;} .icon[data-type="utility"].icon[data-value="arrow-up"].icon[data-color="black"] {background-position:-1em -7em;} .icon[data-type="utility"].icon[data-value="arrow-up"].icon[data-color="grey"] {background-position:-2em -7em;} .icon[data-type="utility"].icon[data-value="arrow-up"].icon[data-color="white"] {background-position:-3em -7em;} /* arrow-down */ .icon[data-type="utility"].icon[data-value="arrow-down"].icon[data-color="blue"] {background-position:0 -8em;} .icon[data-type="utility"].icon[data-value="arrow-down"].icon[data-color="black"] {background-position:-1em -8em;} .icon[data-type="utility"].icon[data-value="arrow-down"].icon[data-color="grey"] {background-position:-2em -8em;} .icon[data-type="utility"].icon[data-value="arrow-down"].icon[data-color="white"] {background-position:-3em -8em;} /* arrow-right */ .icon[data-type="utility"].icon[data-value="arrow-right"].icon[data-color="blue"] {background-position:0 -9em;} .icon[data-type="utility"].icon[data-value="arrow-right"].icon[data-color="black"] {background-position:-1em -9em;} .icon[data-type="utility"].icon[data-value="arrow-right"].icon[data-color="grey"] {background-position:-2em -9em;} .icon[data-type="utility"].icon[data-value="arrow-right"].icon[data-color="white"] {background-position:-3em -9em;} /* arrow-left */ .icon[data-type="utility"].icon[data-value="arrow-left"].icon[data-color="blue"] {background-position:0 -10em;} .icon[data-type="utility"].icon[data-value="arrow-left"].icon[data-color="black"] {background-position:-1em -10em;} .icon[data-type="utility"].icon[data-value="arrow-left"].icon[data-color="grey"] {background-position:-2em -10em;} .icon[data-type="utility"].icon[data-value="arrow-left"].icon[data-color="white"] {background-position:-3em -10em;} /* chevron-up */ .icon[data-type="utility"].icon[data-value="chevron-up"].icon[data-color="blue"] {background-position:0 -11em;} .icon[data-type="utility"].icon[data-value="chevron-up"].icon[data-color="black"] {background-position:-1em -11em;} .icon[data-type="utility"].icon[data-value="chevron-up"].icon[data-color="grey"] {background-position:-2em -11em;} .icon[data-type="utility"].icon[data-value="chevron-up"].icon[data-color="white"] {background-position:-3em -11em;} /* chevron-down */ .icon[data-type="utility"].icon[data-value="chevron-down"].icon[data-color="blue"] {background-position:0 -12em;} .icon[data-type="utility"].icon[data-value="chevron-down"].icon[data-color="black"] {background-position:-1em -12em;} .icon[data-type="utility"].icon[data-value="chevron-down"].icon[data-color="grey"] {background-position:-2em -12em;} .icon[data-type="utility"].icon[data-value="chevron-down"].icon[data-color="white"] {background-position:-3em -12em;} /* chevron-right */ .icon[data-type="utility"].icon[data-value="chevron-right"].icon[data-color="blue"] {background-position:0 -13em;} .icon[data-type="utility"].icon[data-value="chevron-right"].icon[data-color="black"] {background-position:-1em -13em;} .icon[data-type="utility"].icon[data-value="chevron-right"].icon[data-color="grey"] {background-position:-2em -13em;} .icon[data-type="utility"].icon[data-value="chevron-right"].icon[data-color="white"] {background-position:-3em -13em;} /* chevron-left */ .icon[data-type="utility"].icon[data-value="chevron-left"].icon[data-color="blue"] {background-position:0 -14em;} .icon[data-type="utility"].icon[data-value="chevron-left"].icon[data-color="black"] {background-position:-1em -14em;} .icon[data-type="utility"].icon[data-value="chevron-left"].icon[data-color="grey"] {background-position:-2em -14em;} .icon[data-type="utility"].icon[data-value="chevron-left"].icon[data-color="white"] {background-position:-3em -14em;} /* play */ .icon[data-type="utility"].icon[data-value="play"].icon[data-color="blue"] {background-position:0 -16em;} .icon[data-type="utility"].icon[data-value="play"].icon[data-color="black"] {background-position:-1em -16em;} .icon[data-type="utility"].icon[data-value="play"].icon[data-color="grey"] {background-position:-2em -16em;} .icon[data-type="utility"].icon[data-value="play"].icon[data-color="white"] {background-position:-3em -16em;} /* pause */ .icon[data-type="utility"].icon[data-value="pause"].icon[data-color="blue"] {background-position:0 -17em;} .icon[data-type="utility"].icon[data-value="pause"].icon[data-color="black"] {background-position:-1em -17em;} .icon[data-type="utility"].icon[data-value="pause"].icon[data-color="grey"] {background-position:-2em -17em;} .icon[data-type="utility"].icon[data-value="pause"].icon[data-color="white"] {background-position:-3em -17em;} /* stop */ .icon[data-type="utility"].icon[data-value="stop"].icon[data-color="blue"] {background-position:0 -18em;} .icon[data-type="utility"].icon[data-value="stop"].icon[data-color="black"] {background-position:-1em -18em;} .icon[data-type="utility"].icon[data-value="stop"].icon[data-color="grey"] {background-position:-2em -18em;} .icon[data-type="utility"].icon[data-value="stop"].icon[data-color="white"] {background-position:-3em -18em;} /* pause */ .icon[data-type="utility"].icon[data-value="cog"].icon[data-color="blue"] {background-position:0 -19em;} .icon[data-type="utility"].icon[data-value="cog"].icon[data-color="black"] {background-position:-1em -19em;} .icon[data-type="utility"].icon[data-value="cog"].icon[data-color="grey"] {background-position:-2em -19em;} .icon[data-type="utility"].icon[data-value="cog"].icon[data-color="white"] {background-position:-3em -19em;} /* marker */ .icon[data-type="utility"].icon[data-value="marker"].icon[data-color="blue"] {background-position:0 -20em;} .icon[data-type="utility"].icon[data-value="marker"].icon[data-color="black"] {background-position:-1em -20em;} .icon[data-type="utility"].icon[data-value="marker"].icon[data-color="grey"] {background-position:-2em -20em;} .icon[data-type="utility"].icon[data-value="marker"].icon[data-color="white"] {background-position:-3em -20em;} /* =icon (uv) -------------------------------------------------------*/ .icon[data-type="uv"] { background:url(../images/icons/uv.svg) no-repeat 0 0; -webkit-background-size:17.5em 2.5em; -o-background-size:17.5em 2.5em; -moz-background-size:17.5em 2.5em; background-size:17.5em 2.5em; line-height:3em; /* nudge text further down (than icon size of 2.5em) as triangle shape */ overflow:visible; text-indent:0; white-space:normal; } .icon[data-type="uv"].icon[data-img="png"] {background-image:url(../images/icons/uv.png);} .icon[data-type="uv"] {background-position:0 0;} /* - = No data */ .icon[data-type="uv"].icon[data-value="10"] {letter-spacing:-1px;} /* correct spacing for 10 */ .icon[data-type="uv"].icon[data-category="norisk"] {background-position:-2.5em 0; color:#000;} /* 0 = No risk - grey */ .icon[data-type="uv"].icon[data-category="low"] {background-position:-5em 0; color:#000;} /* 1, 2 = Low - green */ .icon[data-type="uv"].icon[data-category="moderate"] {background-position:-7.5em 0; color:#000;} /* 3,4,5 = Moderate - yellow */ .icon[data-type="uv"].icon[data-category="high"] {background-position:-10em 0; color:#000;} /* 6,7 = High - amber */ .icon[data-type="uv"].icon[data-category="vhigh"] {background-position:-12.5em 0; color:#000;} /* 8,9,10 = Very high - red */ .icon[data-type="uv"].icon[data-category="extreme"] {background-position:-15em 0; color:#000; letter-spacing:-1px;} /* 11+ = Extreme - purple */ /* =icon (warnings) -------------------------------------------------------*/ .icon[data-type="warning"] { background:url(../images/icons/warning.svg) no-repeat 0 0; -webkit-background-size:12.5em 2.5em; -o-background-size:12.5em 2.5em; -moz-background-size:12.5em 2.5em; background-size:12.5em 2.5em; } .icon[data-type="warning"].icon[data-img="png"] {background-image:url(../images/icons/warning.png);} /* .png alternative */ .icon[data-type="warning"].icon[data-level="yellow"] {background-color:#ff6;} .icon[data-type="warning"].icon[data-level="amber"] {background-color:#f93;} .icon[data-type="warning"].icon[data-level="red"] {background-color:#c03;} .icon[data-type="warning"].icon[data-level="none"] {background-color:#999;} .icon[data-type="warning"].icon[data-value="rain"] {background-position:0 0;} .icon[data-type="warning"].icon[data-value="wind"] {background-position:-2.5em 0;} .icon[data-type="warning"].icon[data-value="snow"] {background-position:-5em 0;} .icon[data-type="warning"].icon[data-value="ice"] {background-position:-7.5em 0;} .icon[data-type="warning"].icon[data-value="fog"] {background-position:-10em 0;} .icon[data-type="warning"].icon[data-value="none"] {background-position:-12.5em 0;} /* =icon (weather) -------------------------------------------------------*/ .icon[data-type="wx"] { background: url(../images/icons/wx-v1.svg) no-repeat 0 0; -webkit-background-size:15em 15em; -o-background-size:15em 15em; -moz-background-size:15em 15em; background-size:15em 15em; } .icon[data-type="wx"].icon[data-img="png"] {background-image:url(../images/icons/wx.png);} /* wx row 1 */ .icon[data-type="wx"] {background-position:0 0;} /* - = No data */ .icon[data-type="wx"].icon[data-value="0"] {background-position:-2.5em 0;} /* 0 = Clear night */ .icon[data-type="wx"].icon[data-value="1"] {background-position:-5em 0;} /* 1 = Sunny day */ .icon[data-type="wx"].icon[data-value="2"] {background-position:-7.5em 0;} /* 2 = Partly cloudy night */ .icon[data-type="wx"].icon[data-value="3"] {background-position:-10em 0;} /* 3 = Sunny intervals */ .icon[data-type="wx"].icon[data-value="4"] {background-position:-12.5em 0;} /* 4 = Dust */ /* wx row 2 */ .icon[data-type="wx"].icon[data-value="5"] {background-position:0 -2.5em;} /* 5 = Mist */ .icon[data-type="wx"].icon[data-value="6"] {background-position:-2.5em -2.5em;} /* 6 = Fog */ .icon[data-type="wx"].icon[data-value="7"] {background-position:-5em -2.5em;} /* 7 = Cloudy */ .icon[data-type="wx"].icon[data-value="8"] {background-position:-7.5em -2.5em;} /* 8 = Overcast */ .icon[data-type="wx"].icon[data-value="9"] {background-position:-10em -2.5em;} /* 9 = Light shower night */ .icon[data-type="wx"].icon[data-value="10"] {background-position:-12.5em -2.5em;} /* 10 = Light shower day */ /* wx row 3 */ .icon[data-type="wx"].icon[data-value="11"] {background-position:0 -5em;} /* 11 = Drizzle */ .icon[data-type="wx"].icon[data-value="12"] {background-position:-2.5em -5em;} /* 12 = Light rain */ .icon[data-type="wx"].icon[data-value="13"] {background-position:-5em -5em;} /* 13 = Heavy shower night */ .icon[data-type="wx"].icon[data-value="14"] {background-position:-7.5em -5em;} /* 14 = Heavy shower day */ .icon[data-type="wx"].icon[data-value="15"] {background-position:-10em -5em;} /* 15 = Heavy rain */ .icon[data-type="wx"].icon[data-value="16"] {background-position:-12.5em -5em;} /* 16 = Sleet shower night */ /* wx row 4 */ .icon[data-type="wx"].icon[data-value="17"] {background-position:0 -7.5em;} /* 17 = Sleet shower day */ .icon[data-type="wx"].icon[data-value="18"] {background-position:-2.5em -7.5em;} /* 18 = Sleet shower */ .icon[data-type="wx"].icon[data-value="19"] {background-position:-5em -7.5em;} /* 19 = Hail shower night */ .icon[data-type="wx"].icon[data-value="20"] {background-position:-7.5em -7.5em;} /* 20 = Hail shower day */ .icon[data-type="wx"].icon[data-value="21"] {background-position:-10em -7.5em;} /* 21 = Hail */ .icon[data-type="wx"].icon[data-value="22"] {background-position:-12.5em -7.5em;} /* 22 = Light snow shower night */ /* wx row 5 */ .icon[data-type="wx"].icon[data-value="23"] {background-position:0 -10em;} /* 23 = Light snow shower day */ .icon[data-type="wx"].icon[data-value="24"] {background-position:-2.5em -10em;} /* 24 = Light snow */ .icon[data-type="wx"].icon[data-value="25"] {background-position:-5em -10em;} /* 25 = Heavy snow shower night */ .icon[data-type="wx"].icon[data-value="26"] {background-position:-7.5em -10em;} /* 26 = Heavy snow shower day */ .icon[data-type="wx"].icon[data-value="27"] {background-position:-10em -10em;} /* 27 = Heavy snow */ .icon[data-type="wx"].icon[data-value="28"] {background-position:-12.5em -10em;} /* 28 = Thunder shower night */ /* wx row 6 */ .icon[data-type="wx"].icon[data-value="29"] {background-position:0 -12.5em;} /* 29 = Thunder shower day */ .icon[data-type="wx"].icon[data-value="30"] {background-position:-2.5em -12.5em;} /* 30 = Thunder */ .icon[data-type="wx"].icon[data-value="31"] {background-position:-5em -12.5em;} /* 31 = Tropical storm */ .icon[data-type="wx"].icon[data-value="32"] {background-position:-7.5em -12.5em;} /* 32 = not in use */ .icon[data-type="wx"].icon[data-value="33"] {background-position:-10em -12.5em;} /* 33 = Haze */ .icon[data-type="wx"].icon[data-value="34"] {background-position:-12.5em -12.5em;} /* 34 = not in use */ /* =icon (wind) -------------------------------------------------------*/ .icon[data-type="windSpeed"] { background:url(../images/icons/wind.svg) no-repeat 0 0; -webkit-background-size:15em 7.5em; -o-background-size:15em 7.5em; -moz-background-size:15em 7.5em; background-size:15em 7.5em; line-height:2.5em; overflow:visible; text-indent:0; white-space:normal; } .icon[data-type="windSpeed"].icon[data-img="png"] {background-image:url(../images/icons/wind.png);} /* wind row 1 */ .icon[data-type="windSpeed"] {background-position:0 0;} .icon[data-type="windSpeed"].icon[data-value2="S"] {background-position:-2.5em 0;} .icon[data-type="windSpeed"].icon[data-value2="SSW"] {background-position:-5em 0;} .icon[data-type="windSpeed"].icon[data-value2="SW"] {background-position:-7.5em 0;} .icon[data-type="windSpeed"].icon[data-value2="WSW"] {background-position:-10em 0;} .icon[data-type="windSpeed"].icon[data-value2="W"] {background-position:-12.5em 0;} /* wind row 2 */ .icon[data-type="windSpeed"].icon[data-value2="WNW"] {background-position:0 -2.5em;} .icon[data-type="windSpeed"].icon[data-value2="NW"] {background-position:-2.5em -2.5em;} .icon[data-type="windSpeed"].icon[data-value2="NNW"] {background-position:-5em -2.5em;} .icon[data-type="windSpeed"].icon[data-value2="N"] {background-position:-7.5em -2.5em;} .icon[data-type="windSpeed"].icon[data-value2="NNE"] {background-position:-10em -2.5em;} .icon[data-type="windSpeed"].icon[data-value2="NE"] {background-position:-12.5em -2.5em;} /* wind row 3 */ .icon[data-type="windSpeed"].icon[data-value2="ENE"] {background-position:0 -5em;} .icon[data-type="windSpeed"].icon[data-value2="E"] {background-position:-2.5em -5em;} .icon[data-type="windSpeed"].icon[data-value2="ESE"] {background-position:-5em -5em;} .icon[data-type="windSpeed"].icon[data-value2="SE"] {background-position:-7.5em -5em;} .icon[data-type="windSpeed"].icon[data-value2="SSE"] {background-position:-10em -5em;} .icon[data-type="windSpeed"].icon[data-value2="-"] {background-position:-12.5em -5em;}