.menu,
.thearrow7:after {
    -webkit-border-radius: 0
}

.logo,
.menu .active,
.menu copyright,
body,
h1 {
    font-weight: 400;
    -webkit-osx-font-smoothing: grayscale;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: grayscale
}

.menu,
header {
    background: rgba(33, 34, 39, .8)
}

.h2,
.h3,
.h4,
.h5,
.h6,
.weather-container,
.weather-item,
.weather2-container,
body,
h1,
h2,
h3,
h4,
h5,
h6 {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-osx-font-smoothing: grayscale;
    color-adjust: [exact]
}

lowtemptitle,
maxgusttitle,
maxtemptitle,
maxwindtitle,
monthraintitle,
yearraintitle {
    ont: normal 12px arial, system
}

body {
    list-style: none;
    background: rgba(21, 23, 24, 1);
    clear: both;
    font-size: 14px;
    line-height: 1.42857143;
    cursor: url(mouse/weather34redcursor.png), n-resize;
    color: #aaa
}

.logo,
.logo span,
h1 {
    letter-spacing: -.05em
}

,
.weather-container,
.weather-item,
.weather2-container,
.weather2-indoor,
.weatherfooter-container,
.weatherfooter-item,
a,
body {
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    color-adjust: [exact]
}

,
.heading1,
.indoorlocation,
.indoortitles,
.indoortrend,
.tempcontainer,
.tempcontainer1,
.weather-container,
.weather-item,
.weather2-alert,
.weather2-alert.weatherfooter-item,
.weather2-clock,
.weather2-container,
.weather2-indoor,
.weather2-item,
.weatherfooter-container,
.weatherfooter-item,
a,
body,
h3 {
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale
}

,
.heading1,
.indoorlocation,
.indoortitles,
.indoortrend,
.tempcontainer,
.tempcontainer1,
.weather-container,
.weather-item,
.weather2-container,
.weather2-item,
.weatherfooter-container,
.weatherfooter-item,
.wi,
a,
body,
h3,
weatherfooter-item {
    -moz-osx-font-smoothing: grayscale
}

#beaker,
#raintoday,
.cloudbaseweather34,
.cloudbaseweather34>div,
.cloudbaseweather34>div:after,
.norain,
.weather34-rainrate-bar .bar {
    shape-rendering: crispEdges;
    color-adjust: [exact]
}

.bt,
.cl,
a {
    text-decoration: none
}

*,
:after,
:before,
html {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    color-adjust: [exact]
}

*,
:after,
:before,
hr {
    -o-box-sizing: border-box
}

@font-face {
    font-family: system;
    font-style: normal;
    src: local(".SFNSText-Light"), local(".HelveticaNeueDeskInterface-Light"), local(".LucidaGrandeUI"), local("Ubuntu Light"), local("Segoe UI Light"), local("Roboto-Light"), local("DroidSans"), local("Tahoma"), local("Arial")
}

@font-face {
    font-family: weathericons;
    src: url(fonts/weathericons-regular-webfont.eot?) format("eot"), url(fonts/weathericons-regular-webfont.woff) format("woff"), url(fonts/weathericons-regular-webfont.ttf) format("truetype")
}

@font-face {
    font-family: weathertext;
    src: url(fonts/sanfranciscodisplay-regular-webfont.woff) format("woff")
}
@font-face {
    font-family: weathertext2;
    src: url(fonts/verbatim-regular.woff) format("woff"), url(fonts/verbatim-regular.woff2) format("woff2"), url(fonts/verbatim-regular.ttf) format("truetype")
}


*,
:after,
:before {
    -ms-box-sizing: border-box;
    box-sizing: inherit
}

.menu {
    width: 220px;
    margin: 0;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
    -o-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    border-radius: 0;
    float: left;
    height: 1000%;
    max-height: 800px;
    padding: 5px;
    border-right: 1px solid #333;
    border-top: 0;
    border-bottom: 1px solid #333
}

.menu li {
    list-style: none;
    text-align: left;
    padding: 2px 2px 3px;
    border: 0;
    line-height: .8em;
    margin-bottom: 0
}

.weather-item,
body,
header {
    text-align: center
}

.menu copyright {
    font-size: 10px
}

header {
    border: 0;
    -webkit-box-shadow: rgba(0, 0, 0, .1) 0 1px 0;
    -moz-box-shadow: rgba(0, 0, 0, .1) 0 1px 0;
    -o-box-shadow: rgba(0, 0, 0, .1) 0 1px 0;
    -ms-box-shadow: rgba(0, 0, 0, .1) 0 1px 0;
    box-shadow: rgba(0, 0, 0, .1) 0 1px 0;
    height: 3.9em;
    top: 0;
    width: 100%;
    z-index: 4
}

button {
    position: relative;
    font-size: 15px;
    border: 0;
    cursor: pointer;
    margin-right: 0;
    margin-top: -45px;
    width: auto;
    padding: 0;
    background: 0
}

.logo,
header {
    position: absolute
}

.logo,
h1 {
    padding-right: .5em
}

h1 {
    font-size: 1.1em;
    top: 10px
}

.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: inherit;
    line-height: 1.1;
    color: inherit;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased
}

.h1 .small,
.h2 .small,
.h3 .small,
.h4 .small,
.h5 .small,
.h6 .small,
h1 .small,
h2 .small,
h3 .small,
h4 .small,
h5 .small,
h6 .small {
    line-height: 1;
    color: #aaa
}

.h1,
.h2,
.h3,
h1,
h2,
h3 {
    margin-top: 20px;
    margin-bottom: 10px
}

.h4,
.h5,
.h6,
h4,
h5,
h6 {
    margin-top: 10px;
    margin-bottom: 10px
}

.logo {
    color: #aaa;
    font-size: 1.4em;
    font-weight: 600;
    line-height: 3.3em;
    margin-top: -90px
}

.logo span {
    color: #aaa;
    font-weight: 100
}

.weather-container,
.weather-item,
a,
body {
    text-transform: none;
    font-family: arial, system;
    color-adjust: [exact]
}

.weather2-alert.weatherfooter-item,
.weather2-item {
    font-family: Arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    color-adjust: [exact]
}

.weather-container,
.weather-item,
.weather2-container {
    font-family: arial, system;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    color-adjust: [exact]
}

.weather-item,
.weather2-item {
    color: #aaa;
    box-shadow: 0 .25em .25em rgba(0, 0, 0, .1);
    max-height: 360px;
    padding: 3px
}

.featherlight:before,
img,
wm2 {
    vertical-align: middle
}

.sr-only,
svg:not(:root) {
    overflow: hidden
}

.weather-container {
    display: flex;
    list-style: none;
    width: 960px;
    height: 196px;
    overflow: hidden;
    margin: 5px auto;
    background: 0
}

.weather-item {
    width: 32.85%;
    height: 195px;
    border: 0;
    border-bottom: 18px solid rgba(97, 106, 114, .1);
    -webkit-box-shadow: inset 0 20px rgba(97, 106, 114, .1);
    box-shadow: inset 0 20px rgba(97, 106, 114, .1);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 1em;
    margin: 2px;
    padding: 0;
    background: rgba(33, 34, 39, .8)
}

.weather2-container {
    display: flex;
    width: 960px;
    height: 100px;
    margin: 65px auto -20px;
    background: 0
}

.weather2-item {
    padding-left: 10px;
    font-family: arial, system;
    text-align: left;
    text-transform: none;
    float: left;
    width: 33.3333%;
    height: 80px;
    border: 0 solid #404142;
    font-size: .9em;
    margin: 0 2px 2px 0;
    background: 0;
    display: none
}

.chartforecast,
.moduletitle cap,
.monthpopup,
.todaypopup,
.weather34box .title,
.yearpopup {
    text-transform: uppercase;
    white-space:nowrap !important;
}

.weather2-alert,
.weather2-clock {
    background: rgba(33, 34, 39, .8);
    height: 60px
}

.weatherfooter-item {
    background: rgba(33, 34, 39, .8);
    height: 80px
}

.weatherfooter-container,
.weatherfooter-item {
    font-family: Arial, system
}

.alerttopicons img {
    width: 20px;
    margin-top: 38px;
    opacity: .8
}

.alerttopicons svg {
    margin-top: 33px;
    opacity: .5
}

.weatherfooter-container {
    display: flex;
    width: 960px;
    margin: 0 auto 2px
}

.weatherfooter-item {
    width: 100%;
    border: 0;
    text-align: center;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    margin: 0 2px 2px 0;
    padding: 15px
}

.barometergaugegrid {
    width: 90%;
    text-align: center;
    margin: 10px 0 auto
}

h2mb {
    letter-spacing: 0;
    font: 2em weathertext, Arial
}

h2mb span {
    color: #f26c4f;
    margin-left: 0;
    margin-top: 5px;
    font: .4em arial, system
}

.barometertrend steady,
.h2mbunit,
.h2mbvalue {
    color: #aaa
}

.h2mbvalue {
    margin-top: 3px;
    padding-right: 0;
    font-family: weathertext, Arial, system
}

.h2mbunit {
    padding-right: 25px;
    margin-top: -60px;
    margin-left: 115px;
    font: .8em arial, system
}

.barometertrend {
    position: relative;
    color: #aaa;
    text-align: center;
    z-index: 1;
    font: 12px Arial, system;
    margin: -58px auto auto
}

.temptrend {
    position: absolute;
    margin-top: 33px;
    margin-left: 13%;
    text-align: center;
    z-index: auto;
    font-size: 0;
    color: #fff;
    font-family: Arial, system
}

trendmovementfalling,
trendmovementrising {
    color: #fff;
    font-size: 13px;
    margin-left: 15px;
    font-family: weathertext, Helvetica, Arial, system
}

trendmovementsteady {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    margin-left: 10px;
    font-family: arial, system
}

h3 {
    font: 4em weathertext, arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.featherlight {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 40;
    text-align: center;
    white-space: nowrap;
    background: rgba(41, 43, 46, 1);
    margin-left: 0
}

.beaufortconditions,
.featherlight:before,
.nexthours,
.wi {
    display: inline-block
}

.featherlight:last-of-type {
    background: rgba(0, 0, 0, .5)
}

.featherlight:before {
    content: '';
    height: 100%
}

.featherlight .featherlight-content {
    position: relative;
    text-align: left;
    vertical-align: top;
    display: inline-block;
    overflow: hidden;
    border: 5px solid rgba(41, 43, 46, 1);
    width: 855px;
    margin-left: 0;
    margin-right: 0;
    max-height: 550px;
    cursor: auto;
    white-space: normal;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    margin-top: 7.5%;
    padding: 0;
    background: rgba(41, 43, 46, 1);
    background-repeat: no-repeat
}

homesuptempindoor,
supsolar,
suptemp,
suptemp1,
suptemp3,
suptempindoor {
    vertical-align: text-top
}

.featherlight .featherlight-close-icon {
    position: absolute;
    z-index: 9999;
    padding: 3px;
    border-radius: 4px;
    top: 22px;
    left: 7px;
    cursor: pointer;
    text-align: center;
    font: 12px/15px arial, system;
    color: rgba(255, 124, 57, 0);
    background: rgba(255, 124, 57, 0);
    width: 200px
}

.eqtext,
.heading1,
supmb,
supunit {
    color: #aaa
}

.featherlight .featherlight-image {
    width: 100%
}

.featherlight-iframe .featherlight-content {
    border: 0;
    padding: 10px
}

.indoorlocation,
.stationlocationtime {
    padding: 2px 4px 2px 2px;
    margin-left: 35px;
    width: auto;
    position: absolute
}

.featherlight iframe {
    border: 0;
    background: 0
}

.stationlocationtime {
    margin-top: 41px;
    text-align: left;
    font: 10px arial, system
}

.indoortitles {
    color: #aaa;
    margin-top: 5px;
    text-align: center;
    font: 1.2em arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.indoorlocation {
    margin-top: 40px;
    text-align: left;
    font: 400 10px arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    background: rgba(40, 39, 39, .1);
    border-radius: 3px;
    font-weight: 600
}

.eq08,
.eq5,
.eq67 {
    background: 0
}

.indoorvalues {
    position: absolute;
    margin-top: -15px
}

.heading1 {
    font: 1em/15px arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

supmb {
    font-size: .8em
}

supunit {
    font-size: .7em;
    vertical-align: top
}

verticalline {
    border-right: thin solid #aaa;
    margin-right: 10px
}

a:visited {
    border: 0
}

suptemp,
suptemp1 {
    font-size: .5em
}

suptempindoor {
    font-size: .4em;
    margin-left: -5px
}

supsolar {
    font-size: .8em
}

.who {
    margin-top: -30px;
    margin-left: 5%;
    font: 12px arial, system
}

eq {
    font-size: .35em;
    font-weight: 600;
    margin: 32px auto 0 -30px
}

.eqtext {
    float: left;
    width: 100px;
    margin-left: 120px;
    margin-top: -100px;
    font: 9px arial, system;
    font-weight: 600;
    line-height: 9px
}

.eqtext color,
.eqtext depth {
    font-size: 9px;
    color: #9aba2f;
    line-height: 9px
}

.eq03,
.eq08,
.eq45,
.eq5,
.eq67 {
    position: relative;
    padding-top: 15px;
    font: 2em arial, system;
    color: #aaa;
    top: -30px;
    border-radius: 50%;
    margin-left: 20px;
    border: 2px solid rgba(57, 61, 64, 1);
    width: 80px;
    height: 80px;
    text-align: center
}

.eq03:after,
.eq08:after,
.eq67:after {
    font-size: 9px;
    line-height: 10px;
    display: block
}

.eqcircle,
.eqcircle1,
.eqcircle2,
.eqcircle3,
.eqcircle4 {
    position: absolute;
    margin-top: -45px;
    width: 60px;
    margin-left: 220px;
    padding-top: 18px;
    font-family: Arial, system;
    font-size: 22px;
    line-height: 12px
}

.eqcircle,
.eqcircle1 {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    height: 60px
}

.eq03:after {
    content: 'MINOR'
}

.eq03 {
    color: #9aba2f
}

.eq45 {
    color: rgba(230, 161, 65, 1)
}

.eq5 {
    color: rgba(255, 124, 57, 1)
}

.eq08,
.eq67 {
    color: rgba(211, 93, 78, 1)
}

.eq67:after {
    content: 'STRONG'
}

.eq08:after {
    content: 'MAJOR'
}

.eqcircle {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #f26c4f
}

.eqcircle1 {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #9aba2f
}

.eqcircle2,
.eqcircle3 {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    height: 60px
}

.eqcircle2 {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #e48f4c
}

.eqcircle3 {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #ee7259
}

.eqcircle4 {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    height: 60px;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #f26c4f
}

.eqnotification {
    position: fixed;
    top: 70px;
    right: 25px;
    max-width: 400px;
    width: 100%;
    border-radius: 4px;
    z-index: 99999;
    margin: 10px auto;
    padding: 15px
}

dist,
eqnoti {
    margin-left: 5px
}

.eqnotification .eqnotification-close {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 18px;
    border-radius: 50px;
    width: 28px;
    height: 28px;
    line-height: 22px;
    text-align: center;
    color: #aaa
}

.homeweathercompass1>.homeweathercompass-line1,
.homeweathercompass>.homeweathercompass-line {
    right: 25px;
    -webkit-clip-path: polygon(100%0, 100%100%, 100%100%, 0100%, 00);
    -ms-clip-path: polygon(100%0, 100%100%, 100%100%, 0100%, 00)
}

.eqnotification .eqnotification-close:after {
    content: "!";
    color: #aaa
}

.eqnotification .eqnotification-message,
.eqnotification .eqnotification-title {
    color: #aaa;
    font-family: Helvetica, arial, system
}

dist,
eqnoti,
eqnoti color,
eqnoti magn,
eqtime {
    font-family: arial
}

.eqnotification .eqnotification-title {
    position: relative;
    margin-top: -10px;
    font-size: 22px;
    font-weight: 600
}

.eqnotification .eqnotification-message {
    position: relative;
    margin-top: -5px;
    font-size: 13px;
    font-weight: 600;
    line-height: 15px;
    width: 300px
}

.eqnotification .eqnotification-distance {
    position: relative;
    margin-top: -15px;
    font-size: 13px;
    font-weight: 600;
    line-height: 15px;
    width: 300px;
    color: #aaa
}

.eqnotification .eqnotification-credit,
.eqnotification a {
    font-size: 10px;
    line-height: 20px;
    color: #aaa
}

.eqnotification .eqnotification-credit {
    position: absolute;
    font-weight: 600;
    padding-left: 5px;
    margin-top: -10px;
    float: right
}

dist,
magalert {
    margin-top: 5px
}

eqalert,
eqalert1 {
    width: 245px;
    line-height: 10px;
    margin-left: 5px
}

.eqpopup {
    background: #f26c4f
}

.eqpopup .eqnotification-close {
    border: 1px solid #fff;
    color: #aaa
}

dist,
eqnoti color,
eqspan,
magalert {
    color: rgba(255, 112, 50, 1)
}

eqnoti {
    position: absolute;
    margin-top: 15px;
    font-size: 14px;
    color: #878a8d
}

eqnoti color {
    font-size: 1em;
    font-weight: 600
}

eqnoti magn {
    font-size: .8em;
    color: #bbb
}

eqalert,
eqalert1,
magalert {
    position: absolute;
    font-weight: 600;
    font-family: arial
}

magalert {
    margin-left: -15px;
    font-size: 20px
}

eqalert,
eqalert1,
eqspan,
eqspan1 {
    font-size: 9px
}

eqalert {
    margin-top: 17px
}

eqalert1 {
    margin-top: 0
}

eqspan1 {
    color: #00adbc
}

dist,
eqtime {
    line-height: 12px;
    font-size: 10px;
    position: absolute
}

eqtime {
    margin-top: 10px;
    margin-left: 200px;
    font-weight: 400
}

dist {
    font-weight: 600
}

dist place {
    color: #aaa;
    font-size: 9px
}

.eqtext1 {
    color: #aaa;
    float: left;
    width: 100px;
    margin-left: 100px;
    margin-top: -30px;
    font: 9px arial, system;
    line-height: 9px
}

.eqtext1 color,
.eqtext1 color3,
.eqtext1 colordepth,
.eqtext1 colortext {
    line-height: 9px
}

.eqtext1 color {
    color: #9aba2f
}

.eqtext1 colortext {
    color: #9aba2f;
    font-size: 9px
}

.eqtext1 colordepth {
    color: #aaa;
    font-size: 9px
}

.eqtext1 color3 {
    color: #00adbc
}

.baromcircle,
.heatcircle {
    position: absolute
}

.heatcircle-content {
    color: #aaa;
    float: left;
    margin: 0;
    padding: 0;
    text-align: center;
    width: 160px;
    font: 500 11px arial, system;
    display: block;
    line-height: 14px
}

.baromcircle-content {
    float: left;
    line-height: 1;
    margin-top: -.9em;
    padding-top: 50%;
    text-align: center;
    width: 100%;
    color: #76797c;
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    font-weight: 900
}

supraindrop,
supraindropw {
    z-index: 9999999;
    font: .4em weathertext, arial, system
}

.chartforecast,
a {
    font-family: arial, system;
    z-index: 20
}

.baromcircle {
    border-radius: 50%;
    height: 70px;
    width: 70px;
    float: right;
    border-top: .1rem solid rgba(76, 59, 131, .1);
    border-right: .1rem solid rgba(76, 59, 131, .1);
    border-left: .1rem solid rgba(68, 59, 155, .1);
    border-bottom: .1rem solid rgba(68, 145, 155, .1);
    -webkit-background-size: cover;
    -ms-background-size: cover;
    margin-top: -32px;
    margin-left: 212px;
    padding: 2px
}

.chartforecast,
.fullmoon,
.moonrise,
.moonset {
    padding-top: 5px
}

supraindropw {
    color: #f8f8f8
}

.rainfalltext color {
    font-size: 1em;
    color: #387791
}

suprain,
suprain1,
suprain2 {
    font-size: .4em;
    font-weight: 800
}

.chartforecast {
    margin-left: 0;
    font-size: .67em;
    position: absolute;
    color: #aaa;
    margin-top: 174px;
    width: 300px;
    padding-left: 10px;
    text-align: left
}

.daylight,
.feels,
.feels1,
.h2uv,
.max,
.mooncircle moonhead,
.mooncircle span,
.outlooktitle,
.sun,
.wi-fw,
daylighthours {
    text-align: center
}

.humidity,
.windgustcircle,
.windgustheadingcircle {
    padding-top: 35px;
    color: #aaa
}

a {
    font-weight: 600;
    font-size: 1em;
    color: #aaa;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.humidity {
    font: 400 4em arial, system
}

humiditycolor {
    color: rgba(154, 186, 47, 1);
    font-weight: 700
}

.windgustheading {
    color: #aaa;
    font: 1em weathertext, arial, system
}

.windgustcircle {
    position: absolute;
    margin-top: 35px;
    margin-left: -136px;
    font: 20px arial, system
}

.windgustheadingcircle {
    position: absolute;
    margin-top: 14px;
    margin-left: -125px;
    font: 12px arial, system
}

.iconsize {
    font-size: 0;
    width: 50%;
    height: 50%;
    margin-left: 10px
}

.mooninfo {
    margin-left: 120px;
    font: 1em/1.2em arial, system;
    margin-top: 100px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid #777;
    border-top: 1px solid #777;
    width: auto;
    height: 280px;
    padding: 100px 0 10px
}

.homeweathercompass>.homeweathercompass-line,
.mooncircle {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%
}

.h2uv,
.mooncircle {
    border-radius: 50%
}

.line {
    margin-top: 5px;
    border-bottom: 1px solid rgba(255, 255, 255, .3);
    margin-bottom: 5px
}

.mooncircle {
    position: absolute;
    color: #aaa;
    top: 50px;
    height: 160px;
    width: 160px;
    margin-left: 165px;
    border-left: 8px solid rgba(95, 96, 97, .5);
    border-top: 8px solid rgba(95, 96, 97, .8);
    border-right: 8px solid rgba(95, 96, 97, .5);
    border-bottom: 8px solid rgba(95, 96, 97, .8);
    padding-top: 10px;
    font-size: 26px;
    background: rgba(37, 41, 45, .7)
}

.mooncircle span {
    color: #aaa;
    font: 400 2.1em weathertext, arial, system;
    display: block;
    margin-left: 0
}

.mooncircle moonhead {
    position: absolute;
    color: rgba(255, 112, 50, 1);
    font-size: 18px;
    font-family: Arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    margin-top: 20px;
    margin-left: -45px
}

.solar {
    padding-left: 25px;
    font: 2.8em weathertext, Arial, system
}

.h2uv {
    margin-top: 35px;
    position: relative;
    width: 180px;
    height: 180px;
    font: 4em arial, system;
    padding: 40px;
    background: linear-gradient(180deg, #068895, #51b1a5)
}

.daylight,
canvas,
daylighthours:after,
in,
mb {
    position: absolute
}

.sun {
    margin-left: 85px;
    font: .9em/1.3em arial, system;
    margin-top: 10px
}

.luminance,
.luminance:before,
.moonrise,
daylighthours:before {
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale
}

.luminance,
.luminance:before,
.moonrise {
    font-family: arial, system;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.luminance {
    postion: absolute;
    margin-top: 95px;
    font-size: 12px;
    line-height: 12px
}

.luminance:before {
    content: "Luminance";
    font-size: 12px;
    color: rgba(255, 112, 50, 1);
    line-height: 12px;
    margin-left: 5px
}

.moonrise {
    margin-top: -5px;
    margin-left: 0;
    font-size: 12px
}

.moonset {
    margin-top: -32px;
    margin-left: 80px
}

.fullmoon {
    margin-top: -6px;
    margin-left: 0;
    font-size: 12px
}

in,
mb {
    font: .65em arial, system
}

.moon img {
    width: 20px;
    height: 20px
}

.daylight {
    color: #aaa;
    font-family: arial, system;
    z-index: 999;
    top: 50px;
    margin-left: 360px;
    border: 0
}

.windchillcircle,
.windgustmphcircle,
.windmphcircle,
in,
mb {
    -webkit-background-size: cover;
    -ms-background-size: cover
}

.symbol {
    font-size: 10px
}

mb {
    color: #00adbc;
    padding-top: 17px;
    margin-left: -60px
}

in {
    color: rgba(255, 112, 50, 1);
    padding-top: 14px;
    margin-left: -35px
}

wm2 {
    color: #848688;
    font: .4em arial, system
}

.lo,
.max,
.maxws1001 {
    color: #fff;
    position: relative;
    z-index: auto
}

.lo,
.max {
    font-size: .9em;
    font-family: weathertext, system;
    color: #fff
}

.maxws1001 {
    font: .78em arial, system;
    font-weight: 700
}

.feels,
.feels1 {
    position: relative;
    color: #aaa;
    margin-left: auto;
    z-index: auto
}

.feels {
    margin-top: 45px;
    font: 12px arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.windchillcircle-content,
.windgustmphcircle-content,
.windmphcircle-content {
    line-height: 1;
    font-family: arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    text-align: center;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale
}

.windchillcircle,
.windgustmphcircle,
.windmphcircle {
    position: absolute;
    border-radius: 50%;
    height: 65px;
    border-top: .1rem solid rgba(76, 59, 131, .1);
    border-right: .1rem solid rgba(76, 59, 131, .1);
    border-left: .1rem solid rgba(68, 59, 155, .1);
    border-bottom: .1rem solid rgba(68, 145, 155, .1)
}

.windchillcircle {
    width: 65px;
    float: right;
    margin-top: -56px;
    margin-left: 212px;
    padding: 2px
}

.windchillcircle-content {
    float: left;
    margin-top: -.9em;
    padding-top: 40%;
    width: 100%;
    color: #676e73
}

.windgustmphcircle,
.windmphcircle {
    width: 65px;
    float: left;
    margin-top: -56px;
    padding: 2px
}

.windgustmphcircle-content,
.windmphcircle-content {
    float: left;
    color: #aaa
}

.windmphcircle {
    margin-left: 12px
}

.windgustmphcircle {
    margin-left: 212px
}

.whitespace {
    height: 45px
}

sup {
    color: #828487;
    top: -.5em
}

.sup {
    font-size: .3em;
    color: #913636
}

.suptemp {
    font-size: 12px;
    color: #fff;
    position: relative;
    margin-bottom: 50px;
    margin-right: 150px
}

.centered {
    float: none;
    margin-left: auto;
    margin-right: auto
}

.wi-rotate-35 {
    -webkit-transform: rotate(35deg);
    -ms-transform: rotate(35deg);
    transform: rotate(35deg)
}

.wi-rotate-55 {
    -webkit-transform: rotate(55deg);
    -ms-transform: rotate(55deg);
    transform: rotate(55deg)
}

.wi-snow-wind:before {
    content: "\f064"
}

.wi-snow:before {
    content: "\f01b"
}

.wi-smog:before {
    content: "\f074"
}

.wi-smoke:before {
    content: "\f062"
}

.wi-lightning:before {
    content: "\f016"
}

.wi-dust:before {
    content: "\f063"
}

.wi-snowflake-cold:before {
    content: "\f076";
    color: #00adbc
}

.wi-snowflake1-cold:before {
    content: "\f076";
    color: #f8f8f8;
    padding: 10px
}

.wi-windy:before {
    content: "\f021"
}

.wi-strong-wind:before {
    content: "\f050"
}

.wi-sandstorm:before {
    content: "\f082"
}

.wi-fire:before {
    content: "\f0c7"
}

.wi-flood:before {
    content: "\f07c"
}

.outlook {
    background: rgba(37, 41, 45, .7);
    border-radius: 4px;
    padding: 20px;
    border: 1px solid #777;
    width: 600px;
    height: 400px;
    margin-left: 4%
}

.outlook #dayaftertomoicon,
.outlook #dayicon,
.outlook #nticon,
.outlook #tomoicon {
    background-size: 60px;
    height: 60px;
    z-index: 1
}

.outlook .with-badge:before {
    content: "";
    border: 20px solid #00adbc;
    position: absolute;
    top: 0;
    left: 0;
    border-bottom-color: transparent;
    border-right-color: transparent
}

.outlooktitle {
    color: #aaa;
    margin-top: 5px;
    font: 1em arial, system
}

.outlooktitle span {
    color: #aaa;
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased
}

#day,
#dayaftertomo,
#night,
#tomo {
    color: #aaa;
    padding: 5px;
    border-bottom: 0 solid #e9ebf1;
    text-align: left
}

#dayafterraintomo,
#rainday,
#rainnight,
#raintomo {
    color: #00adbc;
    padding: 5px;
    border-bottom: 0;
    text-align: right;
    margin-top: -10px;
    font-size: .9em
}

.iconcurrentwu img,
.iconh3wu {
    margin-top: 0;
    position: relative
}

#day {
    font: .9em arial, system
}

#day span,
#dayaftertomo span,
#tomo span {
    font-family: arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    text-align: left;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility
}

#day span,
#tomo span {
    color: #00adbc
}

#dayaftertomo span {
    color: rgba(255, 112, 50, 1)
}

#dayaftertomo,
#night,
#tomo {
    margin-bottom: auto;
    width: 90%;
    font: .9em arial, system
}

#night span {
    color: #ff6861;
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    text-align: left
}

.iconh3wu,
.iconh3wu span {
    color: #aaa
}

.iconh3wu {
    margin-left: -10px;
    margin-bottom: 5px;
    font-family: Arial;
    font-size: 12px;
    line-height: 12px;
    padding-top: 25px
}

.iconcurrentwu img {
    width: 110px;
    height: 93px;
    float: left;
    margin-left: 10px;
    font-size: 0;
    padding-top: 10px;
    margin-bottom: -10px
}

.wuspace {
    position: relative;
    width: 200px;
    height: 50px;
    background: 0;
    margin-top: -15px
}

.nexthours {
    position: absolute;
    margin-top: 92px;
    font-family: arial, system;
    font-size: 12px;
    margin-left: 50px
}

.beaufortconditions {
    position: relative;
    font-size: 12px;
    color: #aaa;
    width: 140px
}

.wi {
    font-family: weathericons;
    font-style: normal;
    line-height: 1
}

.wi-fw {
    width: 1.4em
}

.updatedtime,
.updatedtimealert,
.updatedtimecurrent,
.updatedtimedir,
.updatedtimeuv {
    width: 75px;
    text-align: center;
    white-space: nowrap
}

.wi-rotate-45 {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.wi-rotate-90 {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.wi-rotate-180 {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.wi-rotate-270 {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg)
}

.wi-flip-horizontal {
    -webkit-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1)
}

.wi-flip-vertical {
    -webkit-transform: scale(1, -1);
    -ms-transform: scale(1, -1);
    transform: scale(1, -1)
}

.wi-raindrops:before {
    content: "\f04e";
    color: #00adbc
}

.wi-raindrop:before {
    content: "\f078";
    color: #00adbc
}

.wi-moonrise:before,
.wi-sunrise:before {
    color: rgba(255, 112, 50, 1)
}

.wi-na:before {
    content: "\f07b"
}

.wi-train:before {
    content: "\f0cb"
}

.wi-moon-0:before {
    content: "\f095"
}

.wi-moon-1:before {
    content: "\f096"
}

.wi-moon-2:before {
    content: "\f097"
}

.wi-moon-3:before {
    content: "\f098"
}

.wi-moon-4:before {
    content: "\f099"
}

.wi-moon-5:before {
    content: "\f09a"
}

.wi-moon-6:before {
    content: "\f09b"
}

.wi-moon-7:before {
    content: "\f09c"
}

.wi-moon-8:before {
    content: "\f09d"
}

.wi-moon-9:before {
    content: "\f09e"
}

.wi-moon-10:before {
    content: "\f09f"
}

.wi-moon-11:before {
    content: "\f0a0"
}

.wi-moon-12:before {
    content: "\f0a1"
}

.wi-moon-13:before {
    content: "\f0a2"
}

.wi-moon-15:before {
    content: "\f0a4"
}

.wi-moon-16:before {
    content: "\f0a5"
}

.wi-moon-17:before {
    content: "\f0a6"
}

.wi-moon-18:before {
    content: "\f0a7"
}

.wi-moon-19:before {
    content: "\f0a8"
}

.wi-moon-20:before {
    content: "\f0a9"
}

.wi-moon-21:before {
    content: "\f0aa"
}

.wi-moon-22:before {
    content: "\f0ab"
}

.wi-moon-23:before {
    content: "\f0ac"
}

.wi-moon-24:before {
    content: "\f0ad"
}

.wi-moon-25:before {
    content: "\f0ae"
}

.wi-moon-26:before {
    content: "\f0af"
}

.wi-moon-27:before {
    content: "\f0b0"
}

.wi-moon-alt-0:before {
    content: "\f0eb"
}

.wi-moon-alt-1:before {
    content: "\f0d0"
}

.wi-moon-alt-2:before {
    content: "\f0d1"
}

.wi-moon-alt-3:before {
    content: "\f0d2"
}

.wi-moon-alt-4:before {
    content: "\f0d3"
}

.wi-moon-alt-5:before {
    content: "\f0d4"
}

.wi-moon-alt-6:before {
    content: "\f0d5"
}

.wi-moon-alt-7:before {
    content: "\f0d6"
}

.wi-moon-alt-8:before {
    content: "\f0d7"
}

.wi-moon-alt-9:before {
    content: "\f0d8"
}

.wi-moon-alt-10:before {
    content: "\f0d9"
}

.wi-moon-alt-11:before {
    content: "\f0da"
}

.wi-moon-alt-12:before {
    content: "\f0db"
}

.wi-moon-alt-13:before {
    content: "\f0dc"
}

.wi-moon-alt-14:before {
    content: "\f0dd"
}

.wi-moon-alt-15:before {
    content: "\f0de"
}

.wi-moon-alt-16:before {
    content: "\f0df"
}

.wi-moon-alt-17:before {
    content: "\f0e0"
}

.wi-moon-alt-18:before {
    content: "\f0e1"
}

.wi-moon-alt-19:before {
    content: "\f0e2"
}

.wi-moon-alt-20:before {
    content: "\f0e3"
}

.wi-moon-alt-21:before {
    content: "\f0e4"
}

.wi-moon-alt-22:before {
    content: "\f0e5"
}

.wi-moon-alt-23:before {
    content: "\f0e6"
}

.wi-moon-alt-24:before {
    content: "\f0e7"
}

.wi-moon-alt-25:before {
    content: "\f0e8"
}

.wi-moon-alt-26:before {
    content: "\f0e9"
}

.wi-moon-alt-27:before {
    content: "\f0ea"
}

.wi-horizon-alt:before {
    content: "\f046"
}

.wi-horizon:before {
    content: "\f047"
}

.wi-moonrise:before {
    content: "\f0c9"
}

.wi-moonset:before {
    content: "\f0ca";
    color: #f26c4f
}

.wi-earthquake:before {
    content: "\f0c6";
    color: #aaa;
    font-size: 1.8em
}

.wi-earthquake1:before {
    content: "\f0c6";
    color: #aaa;
    font-size: 1em
}

.wi-wind:before {
    content: "\f0b1";
    font-size: 1.2em;
    vertical-align: text-bottom
}

.updatedtime,
.updatedtimeuv {
    font: 10px arial, system;
    margin-left: 235px;
    color: #aaa;
    background: 0;
    padding: 3px
}

.wi-wind.towards-45-deg {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg)
}

.wi-wind.towards-90-deg {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg)
}

.wi-wind.towards-135-deg {
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg)
}

.wi-meteor:before {
    content: "\f071";
    color: #aaa
}

#beaker:after,
#beaker:before,
#raintoday:after,
.thearrow:after,
.thearrow:before {
    content: ''
}

.updatedtime {
    margin-top: -18px;
    line-height: 10px
}

.updatedtimeuv {
    margin-top: -112px;
    line-height: 10px
}

.updatedtimeuv span {
    color: #aaa
}

.updatedtimecurrent {
    margin-top: -18px;
    margin-left: 235px;
    color: #aaa;
    font: 10px arial, system;
    line-height: 10px;
    background: 0;
    padding: 3px
}

.updatedtimealert {
    margin-top: 5px;
    margin-left: 215px;
    color: #aaa;
    font: 700 10px arial, system;
    line-height: 10px
}

.updatedtimedir {
    margin-top: -25px;
    margin-left: 135px;
    position: absolute;
    color: #aaa;
    font: 10px arial, system;
    line-height: 10px;
    border-radius: 3px;
    background: 0;
    padding: 3px
}

.average,
.averageuv {
    margin-top: 140px;
    width: 100px;
    text-align: right;
    position: absolute
}

.averagetemp,
.averagetempoutside {
    margin-top: -5px;
    position: absolute
}

.averagetemp,
.averagetemp span,
.averagetempoutside span {
    text-align: center;
    color: #aaa
}

.averagetemp {
    margin-left: -2px;
    font: 700 12px arial, system
}

.averagetemp span {
    font: 400 10px arial, system;
    margin-left: -5px
}

.averagetempoutside {
    width: 50px;
    margin-left: 0;
    color: #aaa;
    font: 700 12px arial, system
}

.solarmax,
.uvmax {
    width: 100px;
    margin-top: 140px;
    position: absolute
}

.averagetempoutside span {
    font: 400 10px arial, system;
    margin-left: 0
}

.solarmax {
    text-align: right;
    margin-left: 168px;
    color: #ff8841;
    font: 700 10px arial, system
}

.solarmax span {
    color: #aaa;
    font: 10px arial, system
}

.uvmax {
    text-align: left;
    margin-left: 27px;
    color: #ff8841;
    font: 700 10px arial, system
}

.uvmax span {
    color: #aaa;
    font: 10px arial, system
}

.solarenergy {
    margin-top: 143px;
    width: 120px;
    text-align: left;
    position: absolute;
    margin-left: 5px;
    color: #aaa;
    font: 700 10px arial, system
}

.solarenergy span {
    color: #9aba2f;
    font: 10px arial, system
}

.average {
    margin-left: 180px;
    color: #00a4b4;
    font: 700 12px arial, system;
    width: 120px
}

.averageuv,
.windrunarea {
    color: rgba(255, 112, 50, 1);
    font: 700 12px arial, system
}

.windrunarea {
    position: absolute;
    margin-left: -70px;
    width: 100px;
    text-align: left
}

.averageuv {
    margin-left: -20px
}

.averageindoor {
    margin-left: 255px;
    color: #aaa;
    font: 400 12px arial, system;
    position: absolute;
    margin-top: 43px;
    width: 85px
}

.barometertrend1 {
    margin-left: 10px;
    margin-top: 120px;
    width: 100px;
    text-align: left;
    position: absolute;
    color: #aaa;
    font: 700 10px arial, system;
    line-height: 9px
}

.barometertrend1 hourtrend {
    font: 400 10px arial, system;
    color: #aaa;
    line-height: 9px;
    text-align: left;
    margin-left: 15px
}

.barometeravg,
.barometermax {
    margin-left: 10px;
    width: 50px;
    position: absolute;
    text-align: center
}

barometerinfo {
    color: #aaa
}

.barometeravg {
    margin-top: 120px;
    color: #aaa;
    font: 12px arial, system;
    line-height: 9px
}

.barometeravg span {
    font: 400 10px arial, system;
    color: #ff8841
}

.barometeravg unit {
    font: 400 10px arial, system;
    color: #aaa
}

.barometermax {
    margin-top: 5px;
    color: #aaa;
    font: 10px arial, system;
    line-height: 9px
}

.averagedir,
.barometermin {
    margin-top: 122px;
    position: absolute;
    text-align: center
}

.barometermax span {
    font: 400 10px arial, system;
    color: #9aba2f
}

.barometermax unit {
    font: 400 10px arial, system;
    color: #aaa
}

.barometermin {
    margin-left: 240px;
    width: 50px;
    color: #aaa;
    font: 10px arial, system;
    line-height: 9px
}

.averagedir,
.barometermin span,
.barometermin unit {
    font: 400 10px arial, system
}

.averagedir,
.averagedir span,
.averagedir span2 {
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale
}

.barometermin span {
    color: #9aba2f
}

.barometermin unit {
    color: #aaa
}

.averagedir {
    margin-left: 115px;
    width: auto;
    color: rgba(255, 112, 50, 1)
}

.averagedir1,
.windrun {
    width: 100px;
    position: absolute;
    text-align: center
}

.averagedir span,
.averagedir span2 {
    margin-bottom: 0;
    color: #aaa;
    font-weight: 600;
    font-family: arial, system
}

.averagedir1 {
    margin-left: 220px;
    margin-top: 100px;
    color: #9aba2f;
    font: 400 10px arial, system
}

.averagedir1 span,
.averagedir1 span2,
.barometertrend falling,
.barometertrend rising,
.barometertrend steady,
.max,
.raintext1,
.rainvalue,
html,
lo,
suprain2,
suptemp {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -o-font-smoothing: antialiased
}

.averagedir1 span,
.averagedir1 span2 {
    margin-bottom: 0;
    color: #aaa;
    text-rendering: optimizeLegibility;
    -moz-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    font-family: arial, system
}

.feelstemp,
.windrun,
.windrun span {
    font: 400 10px arial, system
}

.windrun {
    margin-left: 225px;
    margin-top: 127px;
    color: #aaa
}

.windrun span {
    color: #9aba2f
}

.max,
.raintext1,
.rainvalue,
lo,
suprain2,
suptemp {
    -moz-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.windicons {
    font-size: 0;
    position: absolute;
    margin-top: 75px;
    margin-left: 135px;
    border: 3px solid rgba(57, 61, 64, 1);
    border-radius: 75%;
    padding: 3px
}

.windicons img {
    width: 20px;
    height: 20px
}

.c,
hr {
    height: 0
}

hr,
img {
    border: 0
}

body,
figure {
    margin: 0
}

sub,
sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline
}

.text,
.windvalue {
    font-size: 26px;
    color: #aaa
}

sub {
    bottom: -.25em
}

hr {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    margin-top: 20px;
    margin-bottom: 20px;
    border-top: 1px solid #eee
}

.windirection {
    width: 100%;
    margin: 10px 0 0 85px
}

.homeweathercompass {
    position: absolute;
    width: 175px;
    height: 175px;
    text-align: center;
    margin-top: -20px;
    margin-left: -20px;
    z-index: 1
}

.text {
    z-index: 10;
    text-align: center;
    font-family: weathertext, Arial;
    margin: 60px 0 auto
}

.homeweathercompass>.homeweathercompass-line {
    position: absolute;
    z-index: 10;
    left: 25px;
    top: 25px;
    bottom: 25px;
    border-radius: 50%;
    border-left: 8px solid rgba(95, 96, 97, .5);
    border-top: 8px solid rgba(95, 96, 97, .8);
    border-right: 8px solid rgba(95, 96, 97, .5);
    border-bottom: 8px solid rgba(95, 96, 97, .8);
    margin: auto
}

.thearrow,
.thearrow:after {
    left: 50%;
    top: 0;
    position: absolute
}

.thearrow {
    z-index: 200;
    margin-left: -5px;
    width: 10px;
    height: 50%;
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    animation: rotate 1.5s both linear;
    -webkit-animation: rotate 1.5s both linear;
    -moz-animation: rotate 1.5s both linear;
    -o-animation: rotate 1.5s both linear;
    -ms-animation: rotate 1.5s both linear
}

.animated .thearrow,
.thearrow1 {
    animation: rotate 1.5s both linear;
    -webkit-animation: rotate 1.5s both linear;
    -moz-animation: rotate 1.5s both linear;
    -ms-animation: rotate 1.5s both linear
}

.thearrow:after {
    height: 15px;
    width: 15px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: #f26c4f
}

.weatheroffline:after,
::scrollbar-thumb {
    background-color: #9aba2f
}

#daylight {
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg)
}

.thearrow:before {
    width: 6px;
    height: 6px;
    position: absolute;
    z-index: 9;
    left: 2px;
    top: -3px;
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%
}

.homeweathercompass>.windirectiontext {
    display: block;
    text-align: center;
    color: #aaa;
    font-family: Arial, system;
    font-weight: 600;
    line-height: 12px;
    font-size: 12px;
    z-index: 10;
    margin: 0 0 auto
}

.animated .thearrow {
    -o-animation: rotate 1.5s both linear
}

.rainvalue {
    font-size: 1.1em;
    color: rgba(255, 255, 255, .6);
    margin-left: 30px;
    margin-top: 2%;
    line-height: 1em;
    font-family: weathertext, Arial, system;
    width: 50%
}

.rainvalue span {
    font-size: .6em
}

.raintext1 {
    font-size: 10px;
    color: #00adbc;
    margin-left: 0;
    margin-top: 1%;
    font-weight: 400;
    line-height: 10px;
    font-family: Arial, system
}

.raintext1 span {
    color: #aaa;
    font-size: 1em
}

.maxrainfallmonth,
.maxrainfallyear {
    height: 60px;
    width: 60px;
    float: right;
    -webkit-background-size: cover;
    -ms-background-size: cover;
    padding: 5px;
    position: absolute
}

.maxrainfallmonth {
    border-radius: 50%;
    border: 1px solid rgba(57, 61, 64, 1);
    margin-top: 10px;
    margin-left: 210px
}

.maxrainfallyear {
    border-radius: 50%;
    border: 1px solid rgba(57, 61, 64, 1);
    margin-top: 15px;
    margin-left: -7px
}

.daylightvalue:before {
    position: absolute;
    content: "Estimated";
    display: block;
    font-size: 11px;
    line-height: 20px;
    top: -28px;
    left: 45px;
    letter-spacing: normal
}

.moonimage,
.sunimage {
    left: 55px;
    color: #f8f8f8;
    line-height: 20px;
    z-index: 1;
    position: absolute;
    font-size: 10px
}

.fgtext,
.hrstillsunset,
.hrstillsunset period,
.hrswassunrise,
.hrswassunrise period,
.moduletitle,
.sunrisehome,
.sunrisehome period,
.sunsethome,
.sunsethome period {
    color: #aaa
}

.sunimage {
    top: 4px
}

.wi-daylight:before {
    content: "\f06e"
}

.fgtext,
.moduletitle {
    font-size: 12px
}

.daylightbox,
.solarcircle1,
.solarcircle2 {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%
}

.daylightbox,
.daylightoutputmoon {
    border-radius: 50%;
    position: absolute
}

.daylightbox {
    margin-top: 15px;
    margin-left: 85px;
    width: 120px;
    height: 120px
}

.daylightoutput {
    position: absolute;
    z-index: 0
}

.daylightoutputmoon {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    top: -2px;
    left: -2px;
    width: 160px;
    height: 160px;
    border: 10px solid rgba(57, 61, 64, 1);
    z-index: 10
}

#navigation,
.magnitude:nth-child(1n),
.magnitude:nth-child(2n) {
    display: none
}

.yearpopup {
    margin-left: 10px
}

.monthpopup,
.todaypopup {
    margin-left: 10px
}

.windvalue {
    font-family: weathertext, arial
}

.chartforecast:hover,
.homeweathernotify warmer,
.menu li a:hover,
.temptrendrising,
a:hover {
    color: #9aba2f
}

.h2mbunit,
.outlook,
.updatedtime,
h2mb span {
    position: absolute
}

.barometertrend falling,
.barometertrend rising,
.barometertrend steady,
html {
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -moz-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

#temp,
.a,
.averagetemp span2,
.barometertrend falling,
.barometertrend rising,
.homeweathernotify colder,
.indoorfeels span,
.luminance,
.sun,
.temptrendfalling,
.wi-sunset:before,
.windir,
.windirectiontext span,
suprain,
suprain1,
supraindrop,
supsolar,
suptemp1,
suptempindoor {
    color: #aaa
}

.featherlight .featherlight-inner,
.magnitude:first-child {
    display: block
}

::-webkit-scrollbar {
    width: 12px
}

::-webkit-scrollbar-track {
    background-color: #eaeaea;
    border-left: 1px solid #aaa
}

::-webkit-scrollbar-thumb {
    background-color: #9aba2f
}

::-webkit-scrollbar-thumb:hover {
    background-color: #00adbc
}

::-moz-scrollbar {
    width: 12px
}

::-moz-scrollbar-track {
    background-color: #eaeaea;
    border-left: 1px solid #aaa
}

::-moz-scrollbar-thumb {
    background-color: #9aba2f
}

::-moz-scrollbar-thumb:hover {
    background-color: #00adbc
}

::-o-scrollbar {
    width: 12px
}

::-o-scrollbar-track {
    background-color: #eaeaea;
    border-left: 1px solid #aaa
}

::-o-scrollbar-thumb {
    background-color: #9aba2f
}

::-o-scrollbar-thumb:hover {
    background-color: #00adbc
}

::scrollbar {
    width: 12px
}

::scrollbar-track {
    background-color: #eaeaea;
    border-left: 1px solid #aaa
}

::scrollbar-thumb:hover {
    background-color: #00adbc
}

.cold,
.colder,
.freezing,
.gettingcolder {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    font-size: 0;
    color: #aaa;
    position: absolute;
    text-align: center;
    padding-top: 27%
}

.cold,
.colder,
.extremehot,
.freezing,
.gettingcolder,
.gettingcooler,
.hot,
.hotter,
.mild,
.milder,
.veryhot {
    border: 3px solid rgba(57, 61, 64, 1)
}

.temperaturecirclecold,
.temperaturecirclefreezing,
.temperaturecirclegettingcolder {
    width: 115px;
    height: 115px;
    border-radius: 50%;
    font-size: 0;
    color: #aaa;
    position: absolute;
    text-align: center;
    padding-top: 29%;
    border: 1px solid rgba(0, 172, 223, 1)
}

suprain2 {
    color: #aaa;
    text-rendering: optimizeLegibility
}

.max,
lo,
suptemp {
    color: #fff;
    text-rendering: optimizeLegibility
}

.uv01:after,
.uv03:after,
.uv1112:after,
.uv35:after,
.uv67:after,
.uv810:after {
    content: 'UVINDEX';
    display: block;
    font-size: 9px;
    color: #aaa
}

.solarcircle span,
.solarcircle1 span,
.solarcircle2 span,
.solarcircle3 span {
    color: #aaa;
    text-align: center;
    font: 600 .7em/10px arial, system
}

.solarcircle1,
.solarcircle2,
.solarcircle4 {
    margin-top: -15px;
    height: 60px;
    width: 60px;
    margin-left: 110px;
    padding-top: 18px;
    line-height: 12px;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    position: absolute
}

.solarcircle1,
.solarcircle2 {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    font-family: weathertext, Arial, system;
    font-size: 14px;
    color: #9aba2f
}

.homeweathercompass1>.homeweathercompass-line1,
.solarcircle4 {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%
}

.solarcircle4 {
    -o-border-radius: 50%;
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    font-family: Arial, system;
    font-size: 10px;
    color: #ff8841
}

.solatext color1,
.solatext color2 {
    color: #aaa;
    font-weight: 600
}

.eq45:after,
.eq5:after {
    content: 'MODERATE';
    display: block;
    font-size: 9px;
    line-height: 10px
}

.eqcircle span,
.eqcircle1 span,
.eqcircle2 span,
.eqcircle3 span,
.eqcircle4 span {
    color: #999;
    text-align: center;
    font: 600 .3em/10px arial, system
}

.eqtext1 color1,
.eqtext1 color2 {
    color: #9aba2f;
    font-weight: 400
}

.windgustmphcircle-content,
.windmphcircle-content {
    margin-top: -.9em;
    padding-top: 40%;
    width: 100%
}

.wi-moon-14:before,
.wi-sunrise:before,
.wi-sunset:before {
    content: "\f0a3"
}

.cloudbaseweather34>div:before,
.thearrow1:after,
.thearrow1:before,
.thearrow3:after,
.thearrow3:before,
.thearrow4:after,
.thearrow7:after,
.weather34barometerarrowactual:after {
    content: ''
}

.average span,
.averagedir span,
.averageindoor span,
.averageuv span,
.updatedtime span,
.updatedtimealert span,
.updatedtimecurrent span,
.updatedtimedir span {
    margin-bottom: 0;
    color: #aaa;
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.humidityindoor span,
.temperatureindoor span {
    margin-bottom: 0;
    font-size: .4em;
    color: #aaa;
    font-family: weathertext, arial, system
}

.windalarm span,
.windcondition span {
    margin-bottom: 0;
    color: #aaa;
    font-weight: 600;
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.maxrainfallmonth-content,
.maxrainfallyear-content {
    float: left;
    line-height: 1;
    margin-top: -.9em;
    text-align: center;
    width: 100%;
    font-family: Arial;
    -webkit-font-smoothing: antialiased;
    font-size: .8em
}

.maxrainfallmonth-content {
    padding-top: 37%;
    color: #aaa
}

.maxrainfallyear-content {
    padding-top: 30%;
    color: #999
}

.windalarm,
.windcondition {
    color: #aaa;
    font: 600 9px arial, system;
    position: absolute;
    width: 100px;
    text-align: left
}

.windcondition {
    margin-top: -25px;
    margin-left: 65px
}

.windalarm {
    margin-top: -26px;
    margin-left: 185px
}

.gustspeedtrend,
.gustspeedtrend span {
    color: #aaa;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale
}

.gustspeedtrend,
.windspeedtrend {
    margin-top: 0;
    width: 75px;
    text-align: center;
    position: absolute
}

.avgspeedgust,
.avgspeedwind {
    margin-top: 10px;
    width: 120px;
    text-align: left;
    position: absolute
}

.gustspeedtrend {
    margin-left: 180px;
    font: 12px arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    font-weight: 600
}

.gustspeedtrend span {
    margin-bottom: 0;
    font-weight: 600;
    font-family: arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.windspeedtrend {
    position: absolute;
    margin-left: 45px;
    color: rgba(255, 112, 50, 1);
    font: 12px arial, system;
    font-weight: 600
}

.windspeedtrend span {
    margin-bottom: 0;
    color: #aaa;
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.avgspeedwind {
    margin-left: 30px;
    color: rgba(255, 112, 50, 1);
    font: 12px arial, system;
    font-weight: 600
}

.avgspeedwind span {
    margin-bottom: 0;
    color: #aaa;
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.avgspeedgust {
    margin-left: 195px;
    color: #aaa;
    font: 12px arial, system;
    font-weight: 600
}

.avgspeedgust span {
    margin-bottom: 0;
    color: #aaa;
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.windseparator {
    color: rgba(57, 61, 64, 1)
}

.text1,
.windvalue1 {
    font-family: weathertext, Arial;
    font-size: 26px;
    color: #aaa
}

.windirection1 {
    width: 100%;
    margin: 110px 0 0 85px
}

.homeweathercompass1 {
    position: absolute;
    width: 175px;
    height: 175px;
    text-align: center;
    margin-top: -30px;
    margin-left: 70px;
    z-index: 1
}

.text1 {
    z-index: 10;
    text-align: center;
    margin: 60px 0 auto
}

.windicons1 {
    font-size: 0;
    position: absolute;
    margin-top: 90px;
    margin-left: 25px;
    border: 3px solid rgba(57, 61, 64, 1);
    border-radius: 75%;
    padding: 3px;
    background: rgba(238, 98, 29, 1)
}

.windicons1 img {
    width: 15px;
    height: 15px
}

.homeweathercompass1>.homeweathercompass-line1 {
    position: absolute;
    z-index: 10;
    left: 25px;
    top: 25px;
    bottom: 25px;
    -o-border-radius: 50%;
    border-radius: 50%;
    border-left: 8px solid rgba(95, 96, 97, .5);
    border-top: 8px solid rgba(95, 96, 97, .8);
    border-right: 8px solid rgba(95, 96, 97, .5);
    border-bottom: 8px solid rgba(95, 96, 97, .8);
    margin: auto
}

.mooncircle1,
.thearrow1:after {
    -moz-border-radius: 50%;
    -o-border-radius: 50%
}

.thearrow1,
.thearrow1:after {
    left: 50%;
    top: 0;
    position: absolute
}

.thearrow1 {
    z-index: 200;
    margin-left: -5px;
    width: 10px;
    height: 50%;
    -webkit-transform-origin: 50% 100%;
    -moz-transform-origin: 50% 100%;
    -o-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -o-animation: rotate 1.5s both linear
}

.thearrow1:after {
    height: 15px;
    width: 15px;
    -webkit-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: rgba(255, 112, 50, 1)
}

.thearrow1:before {
    width: 6px;
    height: 6px;
    position: absolute;
    z-index: 9;
    left: 2px;
    top: -3px;
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%
}

.eqcirclehome,
.mooncircle1 {
    -webkit-border-radius: 50%;
    -ms-border-radius: 50%
}

.homeweathercompass1>.windirectiontext1 {
    display: block;
    text-align: center;
    color: #aaa;
    font-family: Arial, system;
    font-weight: 600;
    line-height: 12px;
    font-size: 12px;
    z-index: 10;
    margin: 0 0 auto
}

.windgustvalue,
.windspeedvalue,
.windspeedvalues {
    font-family: weathertext, Helvetica, Arial;
    position: absolute
}

.gustblowing,
.windblowing {
    margin-top: 5px;
    position: absolute;
    font-size: 12px
}

.avgspeedgust1 span,
.avgspeedwind1 span,
.gustspeedtrend1 span,
.windspeedtrend1 span {
    margin-bottom: 0;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale
}

.windirectiontext1 span {
    color: #9aba2f
}

.animated1 .thearrow1 {
    animation: rotate 1.5s both linear;
    -webkit-animation: rotate 1.5s both linear;
    -moz-animation: rotate 1.5s both linear;
    -o-animation: rotate 1.5s both linear;
    -ms-animation: rotate 1.5s both linear
}

.Circle1,
.Circle2 {
    animation: enlarge
}

.windunits {
    color: #aaa
}

.windblowing {
    margin-left: 20px
}

.gustblowing {
    margin-left: 220px
}

.beaufort {
    position: absolute;
    margin-top: 55px;
    margin-left: 50px;
    font-size: 12px
}

.windgustvalue,
.windspeedvalue {
    font-size: 1.75rem;
    margin-top: 45px;
    color: #a0a5a9
}

.windspeedvalues {
    padding-bottom: 5px;
    line-height: 1em;
    height: 50px
}

.windspeedvalue {
    margin-left: 20px
}

.windgustvalue {
    margin-left: 240px
}

.gustspeedtrend1,
.windspeedtrend1 {
    margin-top: -15px;
    position: absolute
}

.avgspeedgust1,
.avgspeedwind1 {
    margin-top: 10px;
    width: 120px;
    text-align: left;
    position: absolute
}

.gustspeedtrend1 {
    width: 75px;
    display: block;
    float: left;
    margin-left: 230px;
    color: #aaa;
    font: 10px arial, system;
    text-align: center
}

.gustspeedtrend1 span {
    color: #aaa;
    font: 10px arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.gustspeedtrend1 max {
    color: rgba(255, 112, 50, 1)
}

.windspeedtrend1 {
    width: 100px;
    display: block;
    float: left;
    margin-left: 0;
    color: #aaa;
    font: 10px arial, system;
    text-align: center
}

.windspeedtrend1 span {
    color: #aaa;
    font: 10px arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.windspeedtrend1 max {
    color: rgba(255, 112, 50, 1)
}

.avgspeedwind1 {
    margin-left: 30px;
    color: #aaa;
    font: 12px arial, system;
    font-weight: 600
}

.avgspeedwind1 span {
    color: #aaa;
    font-family: arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.avgspeedgust1 {
    margin-left: 200px;
    color: #aaa;
    font: 12px arial, system;
    font-weight: 600
}

.avgspeedgust1 span,
.mooncircle1 moonhead1,
.moonrise1,
.moonset1 {
    -moz-font-smoothing: antialiased
}

.avgspeedgust1 span {
    color: #aaa;
    font-family: arial, system;
    -webkit-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.windseparator1 {
    color: rgba(57, 61, 64, 1)
}

.beaufort1 {
    position: absolute;
    margin-top: 120px;
    margin-left: 15px;
    font-size: 10px
}

.mooninfo img,
.sun img {
    margin-bottom: 3px
}

.moon,
.moon1 {
    color: #7c7e80;
    font: 400 .9em/.95em arial, system
}

.moon1:before,
.moon:before {
    content: "";
    color: #00adbc;
    font: .9em arial, system
}

.mooncircle1,
.mooncircle1:after {
    color: #aaa;
    margin-left: 0;
    padding-top: 35px;
    padding-bottom: 10px;
    font-size: 28px;
    font-family: weathertext, arial;
    background: 0
}

.mooncircle1 moonhead1,
.moonrise1,
.moonset1 {
    -webkit-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    text-rendering: optimizeLegibility
}

.mooncircle1 {
    position: absolute;
    border-radius: 50%;
    width: 120px;
    height: 120px;
    border: 4px solid rgba(59, 60, 63, 1)
}

.mooncircle1:after {
    position: absolute;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    width: 110px;
    height: 110px;
    border: 4px solid rgba(59, 60, 63, 1)
}

.mooncircle1 luminance1 {
    position: absolute;
    font-size: 14px;
    margin-top: -15px;
    color: #9aba2f;
    display: block;
    text-align: center;
    margin-left: 22px
}

.mooncircle1 span {
    color: #aaa;
    text-align: center;
    font-family: weathertext, arial, system;
    display: block;
    margin-left: 0;
    margin-top: -5px
}

.mooncircle1 moonhead1 {
    position: absolute;
    color: rgba(255, 112, 50, 1);
    text-align: center;
    font-size: 15px;
    font-family: Arial, system;
    -moz-osx-font-smoothing: grayscale;
    margin-top: 20px;
    margin-left: -45px
}

.moonphase {
    font-size: 10px;
    color: #aaa;
    margin: -10px auto 0;
    display: block;
    padding-top: 5px;
    line-height: 14px;
    font-family: Arial, system
}

.moonphasebox {
    width: 100%;
    margin: 10px 0 0 85px
}

.moonposition {
    font-size: 15px;
    line-height: 20px;
    padding-top: 2px
}

.fullmoon1,
.meteorshower,
.moonrise1,
.moonset1,
.newmoon1 {
    position: absolute;
    padding-top: 5px;
    line-height: 10px;
    text-align: center
}

.moonrise1,
.moonset1 {
    font-family: arial, system;
    width: 75px;
    font-size: 10px;
    -moz-osx-font-smoothing: grayscale
}

.moonrise1 {
    margin-top: 0;
    margin-left: -80px;
    color: #aaa
}

.moonrise1 span {
    color: rgba(255, 112, 50, 1);
    margin-left: 25px
}

.moonset1 {
    margin-top: 100px;
    margin-left: -80px;
    color: #aaa
}

.moonset1 span {
    color: #00adbc;
    margin-left: 15px
}

.fullmoon1,
.meteorshower,
.newmoon1 {
    color: #aaa
}

.fullmoon1 {
    margin-top: 0;
    margin-left: 115px;
    font-size: 10px;
    width: 100px
}

.fullmoon1 span {
    margin-left: 8px
}

.newmoon1 {
    margin-top: 100px;
    margin-left: 115px;
    font-size: 10px;
    width: 110px
}

.newmoon1 span {
    margin-left: 8px
}

.meteorshower {
    margin: 122px auto;
    font-size: 9px;
    width: 130px
}

.b>h1,
.t {
    margin-bottom: 10px
}

.luminance1 {
    padding-top: 0;
    margin-top: 0;
    font: .9em arial, system;
    width: 300px
}

.luminance1:before {
    content: "Phase";
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    color: #00adbc
}

.cl,
.cl:hover,
.feels1,
.t>label {
    color: #aaa
}

.feels1 {
    position: relative;
    margin-left: auto;
    text-align: center;
    z-index: auto;
    margin-top: 30px;
    font: .7em arial, system
}

.b {
    padding: 70px
}

.c {
    background: 0;
    width: 0;
    position: fixed;
    bottom: -20px;
    left: 0;
    transition: bottom .5s ease-in-out;
    z-index: 99999;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

.Circle1,
.Circle2,
.Circle3,
.Location,
.cl,
.indoorcontainer {
    position: absolute
}

.c:target {
    bottom: 0;
    z-index: auto
}

.cl {
    background: #718b1b;
    line-height: 25px;
    width: 32px;
    height: 32px;
    padding: 2px 5px 2px 2px;
    display: block;
    top: -65px;
    left: 5px;
    -webkit-border-radius: 75%;
    -moz-border-radius: 75%;
    border-radius: 75%;
    z-index: auto
}

.ct {
    padding: 30px 30px 0
}

.t>label {
    font-size: 12px
}

.t>input[type=text],
.t>textarea {
    font-size: 15px;
    color: #aaa;
    background: #424242;
    width: 100%;
    padding: 5px;
    border: 0;
    outline: 0;
    box-sizing: border-box;
    transition: background .3s ease-in-out, color .3s ease-in-out;
    border-radius: 4px
}

.weatherwxsim-container,
.weatherwxsim-item,
.wuweather-container,
.wuweather-item {
    width: 960px;
    height: 245px;
    font-family: arial, system;
    -ms-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale
}

.t>input[type=text]:focus,
.t>textarea:focus {
    color: #000;
    background: #fff;
    border-radius: 4px
}

.t>textarea {
    resize: none
}

.bt {
    font-size: 15px;
    color: #000;
    background: #e8e8e8;
    display: inline-block;
    border: 0;
    outline: 0;
    padding: 8px 12px;
    border-radius: 4px
}

.a-r,
.apixuforecast34,
.bt.p,
.bt.p:active,
.bt:active {
    border-radius: 4px
}

#weekday,
.Location1,
.bt.p,
.weather34text,
suptemp1,
suptemp3 {
    color: #aaa
}

.weatherwxsim-container,
.wuweather-container {
    display: flex;
    overflow: hidden;
    list-style: none
}

.weatherwxsim-item,
.wuweather-item {
    font-size: .8em;
    padding: 6px
}

.bt:active {
    background: #f05e40
}

.bt.p {
    background: #00a4b4
}

.bt.p:active {
    background: #f05e40
}

.a-r {
    text-align: right
}

.wuweather-container {
    margin: 5px auto;
    background: 0
}

.wuweather-item {
    border: 1px solid #191b1e;
    border-bottom: 18px solid #191b1e;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    margin: 0 2px 2px 0;
    background: rgba(37, 41, 45, .7)
}

.weatherwxsim-container {
    margin: 5px auto;
    background: 0
}

.weatherwxsim-item {
    border: 1px solid #191b1e;
    border-bottom: 18px solid #191b1e;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    margin: 0 2px 2px 0;
    background: rgba(37, 41, 45, .7)
}

@media screen and (max-width:768px) {
    .weather-container {
        display: inline;
        width: 300px;
        height: 200px;
        background-color: none;
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        -moz-font-smoothing: antialiased;
        -o-font-smoothing: antialiased;
        -ms-font-smoothing: antialiased;
        font-family: arial, system;
        overflow: hidden
    }
    .a,
    .c,
    .chart,
    .chartbarometer,
    .chartdeprem,
    .chartdirection,
    .chartforecast,
    .chartrainfall,
    .chartsky,
    .chartsolar,
    .charttemperature,
    .chartwindspeed,
    .homeweathernotifications,
    .homeweathernotify,
    .w34uptime,
    .weather2-container,
    .weatherfooter-container,
    .weatherheather,
    .weatherwxsim-container,
    .weatherwxsim-item,
    .wuweather-container,
    .wuweather-item,
    header {
        display: none
    }
    .weather-item {
        float: none;
        width: 310px;
        margin: 10px auto 0;
        overflow: hidden
    }
    .c {
        width: auto;
        left: 40px;
        right: 40px
    }
}

@media screen and (max-width:1024px) and (orientation:portrait) {
    .weather-container {
        display: inline;
        width: 300px;
        height: 200px;
        background-color: none;
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        -moz-font-smoothing: antialiased;
        -o-font-smoothing: antialiased;
        -ms-font-smoothing: antialiased;
        font-family: arial, system;
        overflow: hidden
    }
    .a,
    .c,
    .chart,
    .chartbarometer,
    .chartdeprem,
    .chartdirection,
    .chartforecast,
    .chartrainfall,
    .chartsky,
    .chartsolar,
    .charttemperature,
    .chartwindspeed,
    .homeweathernotifications,
    .homeweathernotify,
    .weather2-container,
    .weatherfooter-container,
    .weatherheather,
    .weatherwxsim-container,
    .weatherwxsim-item,
    .wuweather-container,
    .wuweather-item,
    header {
        display: none
    }
    .weather-item {
        float: none;
        width: 310px;
        margin: 10px auto 0;
        overflow: hidden
    }
    .c {
        width: auto;
        left: 40px;
        right: 40px
    }
}

@media screen and (max-width:640px) {
    .weather-container {
        display: inline;
        width: 300px;
        height: 200px;
        background-color: none;
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        -moz-font-smoothing: antialiased;
        -o-font-smoothing: antialiased;
        -ms-font-smoothing: antialiased;
        font-family: arial, system;
        overflow: hidden
    }
    .a,
    .c,
    .chart,
    .chartbarometer,
    .chartdeprem,
    .chartdirection,
    .chartforecast,
    .chartrainfall,
    .chartsky,
    .chartsolar,
    .charttemperature,
    .chartwindspeed,
    .homeweathernotifications,
    .homeweathernotify,
    .weather2-container,
    .weatherfooter-container,
    .weatherheather,
    .weatherwxsim-container,
    .weatherwxsim-item,
    .wuweather-container,
    .wuweather-item,
    header {
        display: none
    }
    .weather-item {
        float: none;
        width: 310px;
        margin: 10px auto 0;
        overflow: hidden
    }
    .c {
        width: auto;
        left: 40px;
        right: 40px
    }
}

.indoorcontainer {
    overflow: hidden;
    z-index: 10;
    margin: 17px 0 0 -5px;
    height: 74px;
    width: 303px;
    background-color: #f05e40;
    border-radius: 5px;
    color: #aaa
}

.Circle1 {
    z-index: 100;
    height: 80px;
    width: 80px;
    right: -20px;
    top: -30px;
    border-radius: 50%;
    background-color: rgba(241, 125, 45, .9);
    animation-duration: 5s;
    animation-iteration-count: infinite
}

.Circle2,
.Circle3 {
    right: -50px;
    border-radius: 50%
}

.Circle2 {
    z-index: 80;
    height: 150px;
    width: 150px;
    top: -70px;
    background-color: rgba(241, 125, 45, .8);
    animation-duration: 7s;
    animation-iteration-count: infinite
}

.Circle3 {
    z-index: 50;
    height: 200px;
    width: 200px;
    top: -100px;
    background-color: rgba(241, 125, 45, .7);
    animation: enlarge;
    animation-duration: 10s;
    animation-iteration-count: infinite
}

.Location,
.sun {
    z-index: 1000;
    font-size: 15px
}

.Location,
.Location1 {
    font-family: weathertext, system;
    right: 20px;
    padding-top: 5px
}

.Location {
    font-weight: 600;
    bottom: 5px
}

.Location1 {
    position: relative;
    font-size: 13px;
    top: 30px;
    margin-left: 155px;
    z-index: 100
}

#wuforecast,
#wuforecast:last-child,
#wuforecast:nth-child(1n),
#wuforecast:nth-child(2n),
#wuforecast:nth-child(3n),
#wuforecasts {
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    font-family: arial, system;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale
}

suptemp3 {
    font-size: .5em
}

@keyframes enlarge {
    50% {
        transform: scale(1.2)
    }
}

#wuforecast:nth-child(4n),
#wuforecast:nth-child(5n),
#wuforecast:nth-child(6n),
#wuforecast:nth-child(7n),
#wuforecast:nth-child(8n),
#wuforecast:nth-child(9n),
.magnitude:nth-child(1n),
.magnitude:nth-child(2n) {
    display: none
}

#wuforecast,
.magnitude:first-child {
    display: block
}

#weekday,
#wuforecast,
#wuforecasts {
    background: 0
}

#wuforecasts {
    max-width: 420px;
    margin-left: 1px;
    margin-right: 0
}

#wuforecast {
    float: left;
    width: 26%;
    margin: -10px 0 0 15px
}

#wuforecast:last-child,
#wuforecast:nth-child(1n),
#wuforecast:nth-child(2n),
#wuforecast:nth-child(3n) {
    margin-right: 0;
    border: 1px solid rgba(57, 61, 64, 1);
    padding: 0;
    border-radius: 4px;
    background: 0;
    height: 135px;
    line-height: 15px
}

#weekday {
    margin: 0;
    text-align: center;
    padding: 3px;
    font: .8em arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    background: rgba(57, 61, 64, 1)
}

#temp,
#temp2 {
    font: 1em arial, system;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    font-weight: 700
}

#temp {
    color: rgba(255, 112, 50, 1)
}

#temp2 {
    color: #00adbc
}

.kmh,
.rain {
    padding-top: 5px;
    font: .9em arial, system;
    font-weight: 700
}

.footertext,
.notificationinfo,
.weather34text {
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale
}

.footertext,
.weather34text {
    font-family: Arial, system;
    -ms-font-smoothing: antialiased
}

#icon {
    width: 55px;
    height: 43px;
    float: left;
    padding: 5px;
    margin: 0 10px -5px
}

#chartdiv {
    width: 100%;
    height: 500px
}

.notificationinfo {
    position: absolute;
    font-size: 12px;
    color: #9aba2f;
    padding: 3px;
    margin-left: 40px;
    top: 53px
}

.weather34text {
    position: absolute;
    font-size: 15px;
    float: left;
    right: 5px;
    font-weight: 600;
    display: none
}

.nextfullmoon,
.nextmoonrise,
.nextmoonset,
.nextnewmoon {
    font-weight: 700;
    display: block;
    text-align: center;
    color: #aaa
}

.designedby a {
    float: left;
    position: absolute;
    text-align: center;
    margin-top: 0;
    margin-left: -50px;
    font-size: 0.45rem;
    width: 100px;
    line-height: 9px;
    font-weight: 400
}

.hardwarelogo1 {
    margin: 0;
    padding: 0;
    float: left
}

.hardwarelogo2 {
    position: absolute;
    margin-left: 780px;
    padding: 0;
    margin-right: 20px
}

.footertext {
    position: relative;
    color: #aaa;
    font-size: 12px;
    justify-content: center;
    align-items: center;
    display: block;
    float: left;
    margin-left: 75px
}

.feelstemp,
.firerisk,
.welcome {
    position: absolute
}

.firerisk {
    margin-top: 132px;
    width: 500px;
    text-align: left;
    margin-left: 4px;
    color: #aaa;
    font: 400 12px arial, system
}

.firerisk lo {
    color: #9aba2f;
    font: 700 12px arial, system;
    text-align: center
}

.firerisk ext,
.firerisk hi,
.firerisk mod,
.firerisk veryhi {
    color: #ff8841;
    font: 700 12px arial, system;
    text-align: center
}

.feelstemp {
    margin-top: 135px;
    text-align: none;
    margin-left: 3px;
    color: #999;
    line-height: 10px
}

.feelstemp risk {
    color: #ff793a;
    font: 400 10px arial, system
}

.welcome {
    font-size: 15px;
    width: 300px;
    margin-top: 25px;
    color: #aaa;
    display: inline;
    margin-left: 30px
}

.welcome span {
    color: #9aba2f;
    font-weight: 600
}

.online {
    color: #aaa;
    font-size: 12px
}

.online span {
    color: #9aba2f;
    font-weight: 600
}

wuhourforecastemp {
    color: #aaa;
    font-weight: 600;
    font-size: 12px;
    line-height: 12px;
    display: inline-block
}

.weatheroffline {
    border-radius: 60px;
    border: 0 solid #777;
    height: 70px;
    width: 70px;
    position: relative;
    top: 35%;
    top: -webkit-calc(50% - 43px);
    top: calc(50% - 43px);
    left: 35%;
    left: -webkit-calc(50% - 43px);
    left: calc(50% - 43px);
    color: #777;
    font-size: 10px
}

.weatheroffline:after,
.weatheroffline:before {
    content: "";
    left: 48%;
    width: 2px;
    border-radius: 5px;
    position: absolute
}

.weatheroffline:after {
    top: 2px;
    height: 18px;
    -webkit-transform-origin: 50% 97%;
    transform-origin: 50% 97%;
    -webkit-animation: weatherofflineani 2s linear infinite;
    animation: weatherofflineani 2s linear infinite
}

@-webkit-keyframes weatherofflineani {
    100% {
        -webkit-transform-webkit-transform: rotate(0) rotate(360deg)
    }
}

@keyframes weatherofflineani {
    100% {
        transformtransform: rotate(0) rotate(360deg)
    }
}

.weatheroffline:before {
    background-color: #0b717a;
    top: 6px;
    height: 15px;
    -webkit-transform-origin: 50% 94%;
    transform-origin: 50% 94%;
    -webkit-animation: weatherofflineani1 12s linear infinite;
    animation: weatherofflineani1 12s linear infinite
}

@-webkit-keyframes weatherofflineani1 {
    100% {
        -webkit-transform-webkit-transform: rotate(0) rotate(360deg)
    }
}

@keyframes ptAiguille {
    100% {
        transformtransform: rotate(0) rotate(360deg)
    }
}

*,
html {
    box-sizing: border-box
}

.homeweathervertical-text {
    margin-top: 50px;
    margin-left: 160px;
    -webkit-transform: rotate(90deg);
    -webkit-transform-origin: left top 0;
    -moz-transform: rotate(90deg);
    -moz-transform-origin: left top 0;
    -o-transform: rotate(90deg);
    -o-transform-origin: left top 0;
    -ms-transform: rotate(90deg);
    -ms-transform-origin: left top 0;
    transform: rotate(90deg);
    transform-origin: left top 0;
    font-size: 3em;
    color: #aaa;
    opacity: .5;
    float: left
}

.homeweathervertical-text span {
    color: #9aba2f
}

.blank {
    display: none
}

.wuforecastbackground {
    background: 0
}

.weather34box.alert,
.weather34box.clock,
.weather34box.earthquake,
.weather34box.indoor {
    background-color: rgba(33, 34, 39, .8);
    -webkit-box-shadow: inset 0 18px rgba(97, 106, 114, .1);
    box-shadow: inset 0 18px rgba(97, 106, 114, .1);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.cloudbase {
    position: absolute;
    color: #aaa;
    font-size: 12px;
    margin-top: 55px;
    margin-left: 85px;
    line-height: 13px
}

.lightningrain,
.rainaverage {
    position: absolute;
    font-size: 10px;
    line-height: 12px;
    font-weight: 700
}

.lightningrain {
    color: #aaa;
    margin-top: 142px;
    margin-left: 0
}

.lightningrain span {
    color: #ff8841;
    font-weight: 700
}

.rainaverage {
    margin-top: 143px;
    width: 100px;
    color: #aaa;
    margin-left: 200px
}

.rainaverage span {
    color: #01a4b4
}

batterypoor,
lightningrain {
    color: #ff8841
}

batterygood {
    color: #9aba2f
}

lightningrain {
    font-size: 18px;
    line-height: 17px;
    display: block;
    font-family: weathertext, arial;
    font-weight: 400
}

.weather34box-toparea {
    margin: 0;
    width: 100%
}

.weather34box {
    border: 2px solid rgba(21, 23, 24, 1);
    border-top: 1px;
    border-bottom: 1px;
    color: #aaa;
    float: left;
    padding: 5px;
    position: relative;
    width: 24.94%;
    height: 83px;
    margin: 0 auto
}

.weather34box .title {
    position: absolute;
    font-family: arial, helvetica;
    font-size: 9px;
    color: #aaa;
    float: left;
    top: 2px;
    background: 0;
    padding: 1px 5px 0
}

.weather34box .value {
    position: absolute;
    font-size: 26px;
    font-weight: lighter;
    padding: 0 3px;
    color: #aaa;
    float: left;
    top: 0
}

.weather34box.indoor span {
    color: #aaa;
    font-weight: 400
}

.weather34box.indoor titlespan {
    color: #9aba2f;
    font-weight: 400
}

.weather34box.clock {
    background-repeat: no-repeat;
    background-position: left 10px bottom 18px;
    color: #fff
}

.weather34box.clock span {
    color: #aaa;
    font-weight: 400
}

.weather34box.clock titlespan {
    color: #9aba2f;
    font-weight: 400
}

.weather34box.alert span,
.weather34box.earthquake span {
    color: #ff8841;
    font-weight: 400
}

.homehumidityindoor {
    margin-left: 70px;
    color: #aaa;
    font: 400 12px arial, system;
    position: absolute;
    margin-top: 20px;
    width: 185px
}

.homehumidityindoor span {
    color: #aaa;
    font-size: 22px;
    font-family: weathertext, arial
}

.hometemperatureindoor {
    margin-left: 0;
    color: #aaa;
    font: 400 12px arial, system;
    position: absolute;
    margin-top: 23px;
    width: 120px
}

.hometemperatureindoor span {
    color: #aaa;
    font-size: 12px
}

homeindoor15,
homeindoor20,
homeindoor25,
homeindoorless20 {
    font: 400 22px weathertext, arial, system
}

homeindoor20,
homeindoor25 {
    color: #ff8841
}

homeindoor20 span,
homeindoor25 span {
    color: #aaa
}

homeindoorless20 {
    color: #00a4b4
}

homeindoor15 {
    color: #fff
}

.homeindoorfeels {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    background: 0;
    border-radius: 3px;
    padding: 0;
    text-align: left
}

.eqcircle1home,
.eqcirclehome {
    -moz-border-radius: 50%;
    -o-border-radius: 50%
}

.homeindoorfeels span {
    color: #aaa;
    font-weight: 600
}

.homeindoorfeels spanuncomfortable {
    color: #e05547;
    font-weight: 400
}

.homeindoorfeels spanwarmer {
    color: #ff8841;
    font-weight: 400
}

.homeindoorfeels spancomfortable,
.homeindoorfeels spancooler {
    color: #9aba2f;
    font-weight: 400
}

.homeindoorfeels spancold {
    color: #b8e1f2;
    font-weight: 400
}

.homeindoorfeels spancolder {
    color: #249aa7;
    font-weight: 400
}

homesuptemp,
homesuptemp1 {
    font-size: .5em;
    vertical-align: text-top;
    margin-left: -7px;
    color: #aaa
}

homesuptempindoor {
    color: #aaa;
    font-size: .4em;
    margin-left: -10px
}

.homeweatheralert {
    position: absolute;
    font-weight: 400;
    font-family: weathertext, Arial, system;
    margin-left: -50px;
    color: #aaa
}

.homeweatheralert alert,
.homeweatheralert alertspan,
.homeweatheralert description,
.homeweatheralert rain span,
.homeweatheralert span2 {
    font-family: Arial, system
}

.homeweatheralert spanbold {
    font-weight: 400
}

.homeweatheralert alert {
    font-size: 13px;
    color: #aaa;
    font-weight: 400
}

.homeweatheralert alertspan,
.homeweatheralert span2 {
    font-size: 12px;
    color: #aaa
}

.homeweatheralert description {
    margin-top: 20px;
    margin-left: 2px;
    font-size: 13px;
    line-height: 12px
}

.homeweatheralert colder {
    color: #01a4b4
}

.homeweatheralert warmer {
    color: #ff8841
}

.homeweatheralert rain {
    color: #01a4b4;
    font-size: 22px
}

.homeweatheralert rain span {
    color: #aaa;
    font-size: 12px
}

.homeweatheralert uvalert {
    color: #ff8841;
    font-size: 22px
}

.homeweatheralert uvalert span {
    color: #aaa;
    font-size: 12px;
    font-family: Arial, system
}

.homeweatheralert noalert,
.homeweatheralert noalert span {
    font-size: 14px;
    font-family: Arial, system;
    margin-top: -25px
}

.homeweatheralert noalert {
    color: #aaa
}

.homeweatheralert noalert span {
    color: #ff8841
}

.eqcircle1home,
.eqcircle2home,
.eqcircle3home,
.eqcirclehome {
    width: 43px;
    height: 43px;
    vertical-align: middle;
    top: 50px;
    position: absolute;
    display: table-cell;
    background: 0;
    text-align: center
}

spanbluemag,
spangreenmag,
spanredmag,
spanyellowmag {
    font-size: 17px;
    font-family: weathertext, Arial, system;
    line-height: 38px
}

.homehardwarestatus online {
    color: #9aba2f
}

.homehardwarestatus offline {
    color: rgba(255, 112, 50, 1);
    font-weight: 600
}

.spane,
spanbluemag,
spane,
spangreenmag,
spanredmag,
spanyellowmag {
    font-weight: 400
}

.eqcirclehome {
    border-radius: 50%;
    border: .12rem solid #aaa
}

.eqcircle1home,
.eqcircle2home,
.eqcircle3home {
    -webkit-border-radius: 50%;
    -ms-border-radius: 50%
}

.eqcircle1home {
    border-radius: 50%;
    border: .12rem solid rgba(95, 96, 97, .9)
}

.eqcircle2home,
.eqcircle3home {
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    border: .12rem solid #aaa
}

.circlelightning,
.circlewindchill {
    height: 41px;
    -o-border-radius: 50%;
    display: table-cell;
    text-align: center;
    -webkit-border-radius: 50%;
    -ms-border-radius: 50%;
    background: 0
}

spanbluemag {
    color: #01a4b4
}

spanyellowmag {
    color: #ff8841
}

spangreenmag {
    color: #9aba2f
}

spanredmag {
    color: #e07262
}

magnitudesymbol {
    color: #aaa;
    font-size: 12px;
    vertical-align: top;
    line-height: 38px
}

.spane {
    position: absolute;
    font-size: 11.5px;
    color: #aaa;
    font-family: Arial, system;
    margin: 38px auto 0 20px;
    text-align: center;
    width: 200px
}

.eqtexthome,
.sunlightday {
    font: 10px arial, system
}

.eqtexthome,
.eqtexthome color {
    font-weight: 400;
    line-height: 10px;
    color: #aaa
}

.eqcircle1home regionalmoderate {
    postion: absolute;
    color: #ff8841;
    top: -10px
}

regionalstrong {
    color: #e07262
}

regionalminor {
    color: #9aba2f
}

.eqtexthome {
    position: absolute;
    float: left;
    width: 160px;
    padding-left: 12px;
    margin-left: 35px;
    margin-top: 52px;
    text-transform: capitalize
}

colordepth,
colordist,
colortext {
    color: #aaa;
    font-weight: 600;
    line-height: 10px
}

colortext {
    font-size: 12px
}

colordepth,
colordist {
    font-size: 10px
}

colordist {
    margin-left: 5px
}

.eqcirclehomeregional {
    position: absolute;
    margin-top: -30px;
    margin-left: -30px;
    font-family: weathertext, Arial, system;
    font-size: 26px;
    line-height: 15px;
    color: #ff8841
}

.eqcircle1homeregional,
.eqcircle2homeregional,
.eqcircle3homeregional,
.eqcircle4homeregional {
    position: absolute;
    margin-top: 30px;
    font-family: weathertext, Arial, system;
    font-size: 26px;
    line-height: 12px;
    color: #ff8841
}

.eqtexthomeregional {
    color: #aaa;
    float: left;
    width: 300px;
    margin-left: 30px;
    margin-top: 15px;
    font: 9px arial, system;
    line-height: 12px;
    font-weight: 600
}

.eqtexthomeregional color {
    color: #aaa;
    font-weight: 600;
    line-height: 9px
}

.eqtexthomeregional colordepth,
.eqtexthomeregional colortext {
    color: #aaa;
    font-weight: 600;
    font-size: 9px;
    line-height: 9px
}

.eqtexthomeregional colordist {
    color: #ff8841;
    font-weight: 600;
    line-height: 9px
}

spangreen,
spanred,
spanyellow {
    margin-top: 50px;
    line-height: 54px
}

.earthquakestatus {
    position: absolute;
    margin-left: 60px;
    top: 60px;
    color: #aaa;
    font-family: arial, system;
    font-size: 10px;
    width: 200px;
    font-weight: 400
}

spanheat,
spanyellow,
spanyellowbig {
    color: #ff8841
}

spangreen,
spangreenbig {
    color: #9aba2f
}

spangredbig,
spanred {
    color: #e07262
}

spanm,
spanm2 {
    font-family: Arial, system;
    color: #aaa
}

spanm {
    font-size: 12px
}

spanm2 {
    font-size: 14px;
    margin-top: 40px;
    line-height: 15px
}

spanm4 {
    font-weight: 600;
    color: #aaa
}

spanm5 {
    color: #aaa;
    font-size: 12px
}

spanheat {
    font-size: 22px
}

spangredbig,
spangreenbig,
spanyellowbig {
    font-family: weathertext, Arial, system;
    font-size: 26px;
    float: left;
    line-height: 33px;
    font-weight: 400
}

spanblue {
    color: #01a4b4
}

strength {
    font-size: 13px;
    color: #aaa;
    font-family: Arial, system;
    font-weight: 400
}

.cumulussunshine {
    margin-left: 0;
    color: #aaa;
    font: 400 12px arial, system;
    position: absolute;
    margin-top: 20px;
    width: 120px
}

.cumulusisitsunny,
.cumulusmaxsolar {
    position: absolute;
    width: 180px;
    color: #aaa
}

cumulussunshinespan {
    color: #ff8841;
    font: 400 18px weathertext, arial, system
}

cumulussunshinesuptemp {
    font-size: 12px;
    vertical-align: text-top;
    margin-left: 7px;
    color: #aaa
}

.cumulusisitsunny {
    margin-left: 50px;
    font: 400 12px arial, system;
    margin-top: 25px
}

cumulusisitsunny {
    font: 400 26px weathertext, arial, system;
    font-size: .4em;
    vertical-align: text-top;
    margin-left: -7px;
    color: #aaa
}

.cumulusmaxsolar {
    margin-left: 50px;
    font: 400 12px arial, system;
    margin-top: 40px
}

cumulusmaxsolarspan {
    color: #aaa;
    font: 400 26px weathertext, arial, system
}

cumulusmaxsolarsuptemp {
    font-size: .4em;
    vertical-align: text-top;
    margin-left: -7px;
    color: #aaa
}

.clockiconsvg {
    position: relative;
    top: 25px;
    margin-left: 150px;
    color: #aaa;
    opacity: .5
}

.lowtemp,
.maxgust,
.maxtemp,
.maxwind,
.monthrain,
.yearrain {
    position: absolute;
    width: 220px;
    min-width: 220px
}

.maxtemp {
    margin-left: 0;
    color: #aaa;
    font: 400 12px weathertext, arial, system;
    margin-top: 20px
}

maxtempspan,
maxtemptitle {
    color: #ff8841
}

maxtempspan {
    font: 400 20px weathertext, arial, system
}

maxtempsuptemp {
    font-size: .4em;
    vertical-align: text-top;
    margin-left: 3px;
    color: #aaa
}

.circlelightning,
.circlelowtemp,
.circlemaxgust,
.circlemaxwind,
.circlerainmonth,
.circlerainyear,
.circlewindchill,
.main-menu .nav-text,
.text2 span,
lowtemptime,
maxgusttime,
maxtemptime,
maxwindtime,
monthraintime,
yearraintime {
    vertical-align: middle
}

maxtemptime {
    font-size: 10px;
    margin-left: -3px;
    color: #aaa
}

.lowtemp {
    margin-left: 0;
    color: #aaa;
    font: 400 12px weathertext, arial, system;
    margin-top: 45px
}

lowtempspan,
lowtemptitle {
    color: #01a4b4
}

lowtempspan {
    font: 400 20px weathertext, arial, system
}

lowtempsuptemp {
    font-size: .4em;
    margin-left: 3px;
    color: #aaa
}

lowtemptime {
    font-size: 10px;
    margin-left: -6px;
    color: #aaa
}

.maxwind {
    margin-left: 0;
    color: #aaa;
    font: 400 12px arial, system;
    margin-top: 20px
}

maxwindspan,
maxwindtitle {
    color: #9aba2f
}

maxwindspan {
    font: 400 20px weathertext, arial, system
}

maxwindtime {
    font-size: 10px;
    margin-left: 1px;
    color: #aaa
}

.maxgust {
    margin-left: 0;
    color: #aaa;
    font: 400 12px arial, system;
    margin-top: 45px
}

maxgustspan,
maxgusttitle {
    color: #ff8841
}

maxgustspan {
    font: 400 20px weathertext, arial, system
}

maxgusttime {
    font-size: 10px;
    margin-left: -2px;
    color: #aaa
}

.yearrain {
    margin-left: 0;
    color: #aaa;
    font: 400 12px arial, system;
    margin-top: 20px
}

.yearrain span {
    margin-left: 2px;
    color: #01a4b4
}

.monthrain,
monthraintitle,
yearraintime,
yearraintitle {
    color: #aaa
}

yearrainspan {
    color: #01a4b4;
    font: 400 18px weathertext, arial, system
}

yearraintime {
    font-size: 10px;
    margin-left: 1px
}

.monthrain {
    margin-left: 0;
    font: 400 12px arial, system;
    margin-top: 40px
}

monthrainspan {
    color: #01a4b4;
    font: 400 18px weathertext, arial, system
}

monthraintime {
    font-size: 10px;
    margin-left: 1px;
    color: #aaa
}

spanalert,
sunshineicon {
    color: #ff8841
}

.hoursago {
    postion: absolute;
    font-size: 12px;
    color: #aaa;
    font-family: Arial, system;
    margin-top: -30px;
    width: 200px;
    margin-left: 30px;
    font-weight: 400
}

.circlewindchill,
spanunit,
spanunitf {
    font-family: weathertext, Arial, system
}

.cloudbase34,
.weather34forecast,
.weather34forecastz {
    color: #aaa;
    position: absolute
}

.weather34forecast {
    font-size: 12px;
    width: 250px;
    text-align: center;
    margin: 32px 2px auto 25px;
    line-height: 12px;
    padding: 3px
}

.cloudbase34 {
    font-size: 12px;
    margin-top: 85px;
    margin-left: 85px;
    line-height: 13px
}

.weather34forecastz {
    font-size: .83em;
    width: 285px;
    text-align: center;
    margin: 30px 5px auto;
    line-height: 12px;
    padding: 3px
}

.weather34forecastz span {
    color: #ff8841
}

.weather34forecastz spancooler {
    color: #01a4b4
}

.weather34forecastz spanovcast {
    color: #aaa
}

.weather34forecastz spanstronger {
    color: #e47769
}

.cloudbase34z {
    position: absolute;
    color: #aaa;
    font-size: 12px;
    margin-top: 0;
    margin-left: 140px;
    line-height: 12px
}

spanunit,
spanunitf {
    color: #aaa;
    font-size: 12px;
    margin-left: 10px
}

.circlewindchill {
    width: 41px;
    -moz-border-radius: 50%;
    border-radius: 50%;
    position: absolute;
    top: 40px;
    border: .12rem solid rgba(95, 96, 97, .9);
    font-size: 16px;
    line-height: 41px;
    color: #01a4b4;
    font-weight: 400
}

.circleindoortemp,
.circleindoortemphot,
.circleindoortempwarm,
.circlelightning {
    -moz-border-radius: 50%;
    position: absolute;
    line-height: 41px
}

spanewindchill {
    position: absolute;
    font-size: 12px;
    color: #aaa;
    font-family: Arial, system;
    top: 0;
    width: 200px;
    left: 20px
}

.circlelightning,
svgwindchill {
    font-family: weathertext, Arial, system;
    font-weight: 400
}

svgwindchill {
    color: #01a4b4
}

.cloudbasewd,
.weatherdisplayforecast {
    color: #aaa;
    font-size: 12px;
    position: absolute
}

.weatherdisplayforecast {
    width: 280px;
    text-align: center;
    margin: 42px 2px auto;
    line-height: 12px;
    padding: 3px
}

.cloudbasewd {
    margin-top: 105px;
    margin-left: 85px;
    line-height: 13px
}

.circlelightning {
    width: 43px;
    border-radius: 50%;
    top: 40px;
    border: .12rem solid rgba(95, 96, 97, .9);
    font-size: 17px;
    color: #ff8841
}

.circleindoortemp,
.circleindoortemphot,
.circleindoortempwarm,
.circlemaxtemp {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    background: 0
}

aqigrey,
supdavis {
    vertical-align: top
}

spanelightning {
    position: absolute;
    font-size: 12px;
    color: #aaa;
    font-family: Arial, system;
    top: -10px;
    width: 200px;
    left: 20px;
    font-weight: 400
}

.circleindoortemp,
.circleindoortemphot,
.circleindoortempwarm {
    width: 40px;
    top: 22px;
    font-size: 15px;
    font-family: weathertext, Arial, system;
    height: 40px
}

svglightning {
    color: #ff8841;
    font-family: weathertext, Arial, system
}

.circleindoortemphot {
    border-radius: 50%;
    border: .12rem solid rgba(95, 96, 97, .9);
    color: #d97365;
    line-height: 41px
}

.circleindoortempwarm {
    border-radius: 50%;
    border: .12rem solid rgba(95, 96, 97, .9);
    color: #ff8841;
    line-height: 41px
}

.circleindoortemp,
.circlemaxgust {
    border-radius: 50%;
    line-height: 41px
}

.circleindoortemp {
    border: .12rem solid rgba(95, 96, 97, .9);
    color: #9aba2f
}

.homeindoorhum,
spaneindoortemp {
    font-size: 13px;
    position: absolute
}

spaneindoortemp {
    color: #aaa;
    font-family: Arial, system;
    top: -10px;
    width: 30px;
    left: 35px
}

.circlemaxtemp,
.homeindoorhum,
spanehomeindoorhum,
svgindoortemp {
    font-family: weathertext, Arial, system
}

svgindoortemp {
    color: #ff8841
}

.homeindoorhum {
    margin-left: 45px;
    top: 30px;
    width: 200px;
    color: #aaa
}

spanhomeindoorvalue {
    color: #9aba2f
}

spanehomeindoorhum {
    position: absolute;
    font-size: 12px;
    color: #aaa;
    top: -5px;
    width: 200px;
    left: 42px
}

.homeindoorfeels,
spanefeels,
spanfeelstitle,
spanhomeindoorhumtitle {
    font-size: 13px;
    font-family: weathertext, Arial, system;
    width: 200px;
    font-weight: 400
}

spanhomeindoorhumtitle {
    color: #aaa;
    top: 10px;
    left: 10px
}

.homeindoorfeels {
    position: absolute;
    margin-left: 105px;
    top: 50px;
    color: #ff8841
}

.homehardwareindoorfeels,
spanefeels {
    color: #aaa
}

spanindoortemprising,
svgmaxtemp {
    color: #ff8841
}

spanefeels {
    position: absolute;
    top: -5px;
    left: 85px
}

spanfeelstitle {
    color: #aaa;
    top: 10px;
    left: 10px
}

.hometemperatureindoortrend {
    margin-left: 13px;
    position: absolute;
    margin-top: 34px;
    width: 15px
}

spanindoortempsteady {
    color: #9aba2f
}

spanindoortempfalling {
    color: #01a4b4
}

.circlemaxtemp {
    width: 40px;
    height: 40px;
    -moz-border-radius: 50%;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    border: .12rem solid rgba(95, 96, 97, .9);
    font-size: 15px;
    line-height: 41px;
    color: #ff8841;
    margin-left: 20px
}

.circlelowtemp,
.circlemaxwind {
    -moz-border-radius: 50%;
    height: 40px;
    position: absolute;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    display: table-cell;
    text-align: center;
    background: 0;
    line-height: 41px
}

spanmaxtemp {
    position: absolute;
    font-size: 12px;
    color: #aaa;
    font-family: Arial, system;
    top: -10px;
    width: 100px;
    left: 15px
}

.circlelowtemp,
svgmaxtemp {
    font-family: weathertext, Arial, system
}

.circlelowtemp {
    width: 40px;
    border-radius: 50%;
    top: 2px;
    border: .12rem solid rgba(95, 96, 97, .9);
    font-size: 15px;
    color: #01a4b4;
    margin-left: 120px
}

spanlowtemp {
    position: absolute;
    font-size: 12px;
    color: #aaa;
    font-family: Arial, system;
    top: -10px;
    width: 100px;
    left: 15px
}

.circlemaxwind,
svglowtemp {
    font-family: weathertext, Arial, system;
    color: #01a4b4
}

.circlemaxwind {
    width: 40px;
    border-radius: 50%;
    top: 2px;
    border: .12rem solid rgba(95, 96, 97, .9);
    font-size: 15px;
    margin-left: 20px
}

spanmaxwind,
spanwindtitle {
    width: 100px;
    left: 15px;
    position: absolute;
    font-weight: 400
}

.circlemaxgust,
.circlerainyear {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%
}

spanmaxwind {
    font-size: 12px;
    color: #01a4b4;
    font-family: Arial, system;
    top: -12px
}

svgmaxwind {
    color: #aaa;
    font-family: weathertext, Arial, system
}

spanwindtitle {
    font-size: 12px;
    color: #ff8841;
    font-family: Arial, system;
    top: 0
}

.circlemaxgust {
    width: 40px;
    height: 40px;
    display: table-cell;
    text-align: center;
    background: 0;
    position: absolute;
    top: 2px;
    border: .12rem solid rgba(95, 96, 97, .9);
    font-size: 15px;
    color: #ff8841;
    font-family: weathertext, Arial, system;
    margin-left: 120px
}

spanmaxgust {
    position: absolute;
    font-size: 13px;
    color: #aaa;
    font-family: Arial, system;
    top: -10px;
    width: 100px;
    left: 12px
}

.circlerainmonth,
.circlerainyear,
svgmaxgust {
    font-family: weathertext, Arial, system;
    color: #01a4b4
}

.circlerainmonth,
.circlerainyear {
    width: 2.7rem;
    height: 2.7rem;
    display: table-cell;
    text-align: center;
    top: 2px;
    line-height: 41px;
    position: absolute;
    background: 0
}

.rainannual,
svgearthquake {
    display: block;
    position: absolute
}

.circlerainyear {
    border-radius: 50%;
    border: .1rem solid rgba(95, 96, 97, .9);
    margin-left: 20px;
    font-size: 1em
}

.circlerainmonth,
.solarpoor {
    -webkit-border-radius: 50%;
    -o-border-radius: 50%
}

.circlerainmonth {
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    border: .12rem solid rgba(95, 96, 97, .9);
    margin-left: 120px;
    font-size: 1em
}

.solardark,
.solarlow,
.solarpoor {
    -moz-border-radius: 50%;
    -ms-border-radius: 50%
}

spanrain {
    position: absolute;
    font-size: 13px;
    color: #aaa;
    font-family: Arial, system;
    top: -10px;
    width: 100px;
    left: 12px
}

.homeindoordate,
am,
pm {
    font-size: 12px;
    font-weight: 400
}

svgrain {
    color: #01a4b4;
    font-family: weathertext, Arial, system
}

.w34logo {
    float: right;
    margin-right: 40px;
    margin-top: -35px;
    color: #9aba2f
}

.homeindoordate {
    position: absolute;
    color: #aaa;
    text-transform: none;
    top: 23px;
    right: 40px;
    font-family: Arial, system;
    width: 200px;
    list-style: none
}

.solardark,
.solarlow,
.solarpoor,
.uv01a,
.uv03a,
.uv1112a,
.uv35a,
.uv67a,
.uv810a,
.uvi1112a {
    width: 60px;
    height: 60px
}

blue,
fall,
oblue {
    color: #01a4b4
}

oorange,
orange,
rise {
    color: #ff8841
}

green,
ogreen {
    color: #9aba2f
}

ored,
red {
    color: #e47769
}

firealert {
    color: #aaa;
    font-size: 13px;
    top: 45px;
    float: left;
    margin-left: 25px
}

.solarpoor,
.weather34cloud {
    font-size: 12px;
    position: absolute;
    font-weight: 400
}

svgearthquake {
    top: 13px;
    left: 15px
}

.weather34cloud {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=3);
    color: #aaa;
    margin-left: 200px;
    margin-top: 0;
    font-family: weathertext, arial, system;
    max-height: 120px
}

.solardark,
.solarpoor {
    line-height: 14px;
    color: #aaa;
    font-family: Arial, system
}

.solarpoor {
    margin-top: 10px;
    margin-left: 40px;
    padding-top: 18px;
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1)
}

.solardark,
.solarlow {
    position: absolute;
    margin-top: 5px;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    margin-left: 40px
}

.solargood,
.solarmoderate,
.solarverygood {
    margin-top: 10px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    margin-left: 40px;
    width: 60px;
    height: 60px;
    text-rendering: optimizeLegibility;
    position: absolute
}

.solardark {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    padding-top: 15px;
    font-size: 12px;
    font-weight: 400
}

.solargood,
.solarlow,
.solarmoderate,
.solarverygood {
    padding-top: 18px;
    font-family: weathertext, Arial, system;
    line-height: 14px
}

.solarlow {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    font-size: 18px;
    font-weight: 400;
    color: #01a4b4
}

.solargood,
.solarmoderate {
    font-weight: 400;
    font-size: 18px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%
}

.solarmoderate {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #9aba2f
}

.solargood {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #ff8841
}

.solarverygood {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    font-size: 13px;
    color: #e47363
}

grey {
    font-size: 10px
}

.uv01a,
.uv03a,
.uv35a,
.uv67a,
.uv810a,
.uvi1112a {
    border-radius: 50%;
    margin-left: 40px;
    border: 2px solid rgba(57, 61, 64, 1)
}

.uvi810a span,
p {
    color: #aaa
}

.uvi1112a {
    padding-top: 20px;
    font: 1.7em Helvetica, Arial, Helvetica;
    margin-top: -5px;
    text-align: center;
    line-height: 40px;
    color: #a475cb
}

.uv01a,
.uv03a,
.uv1112a,
.uv35a,
.uv67a,
.uv810a {
    padding-top: 3%;
    margin-top: -5px
}

.uv01a,
.uv03a {
    font: 2em weathertext, arial, system;
    text-align: center;
    font-weight: 400
}

.uvi1112a span,
p {
    color: #aaa
}

.uv01a {
    color: #777
}

.uv03a {
    color: #9aba2f
}

.uv35a,
.uv67a {
    font: 2em weathertext, arial, system
}

.uv35a,
.uv67a,
spaneboltek {
    font-weight: 400
}

.aqi01a,
.aqi03a,
.uv810a {
    font: 2em weathertext, arial, system
}

.uv35a {
    color: rgba(255, 112, 50, 1);
    text-align: center
}

.uv67a,
.uv810a {
    text-align: center
}

.aqi03a,
.aqi35a,
.uv1112a {
    border-radius: 50%;
    margin-left: 40px
}

.uv67a {
    color: #ff793a
}

.uv810a {
    color: #e47363;
    font-weight: 400
}

.aqi1112a,
.uv1112a {
    font: 1.9em weathertext, arial, system
}

.uv1112a {
    color: #a475cb;
    border: 2px solid rgba(57, 61, 64, 1);
    text-align: center;
    font-weight: 400
}

uvia {
    font-size: .3em;
    text-align: center;
    position: absolute;
    color: #aaa;
    margin: 30px auto 0 -32px
}

.weather34-cloudbase-bar .bar-inner:after {
    background: rgba(1, 164, 180, .9);
    width: 80px;
    padding: 0;
    margin-left: 0;
    top: 0;
    font-size: 10px;
    font-family: Arial, system;
    font-weight: 600;
    shape-rendering: crispEdges;
    color: #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.cloudbaseweather34 {
    position: absolute;
    font-family: Arial, system;
    width: 114px;
    max-width: 114px;
    height: 120px;
    margin: 19px 0 0 95px;
    background: url(rain/markercloud.svg) bottom no-repeat;
    background-color: #0;
    border: 4px solid rgba(57, 61, 64, 1);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    shape-rendering: crispEdges
}

.cloudbaseweather34>div {
    text-align: center;
    font-size: 0;
    shape-rendering: crispEdges;
    position: absolute;
    bottom: 0;
    width: 100%;
    margin: 0;
    border-top: dotted 1px rgba(255, 136, 65, 1)
}

.cloudbaseweather34>div:after {
    background: rgba(57, 61, 64, 1);
    width: 120px;
    padding: 0 3px;
    margin-left: 3px;
    bottom: 3px;
    font-size: 12px;
    font-family: Arial, Helvetica;
    font-weight: 600;
    shape-rendering: crispEdges;
    color: #aaa;
    opacity: 1
}

.cloudbaseweather34>div:before {
    position: absolute;
    font-size: 0;
    width: 0;
    margin-top: 0;
    background: 0;
    height: 0;
    border-left: 0 solid transparent;
    border-right: 0 solid transparent;
    border-bottom: 0 solid rgba(255, 255, 255, 1);
    margin-left: -10px
}

.cloudbaseweather34.clear>div {
    background-color: rgba(255, 255, 255, .1)
}

grey {
    color: #aaa
}

spaneboltek {
    font-size: 12px;
    position: absolute;
    color: #aaa;
    font-family: Arial, system;
    top: -10px;
    width: 130px;
    left: 20px
}

spanboltekdist,
spanbolteklast {
    font-family: weathertext, Arial, system;
    color: #aaa;
    font-size: 12px;
    position: absolute;
    font-weight: 400
}

spanboltekdist {
    width: 160px;
    top: 10px;
    left: -10px
}

spanbolteklast {
    width: 180px;
    top: 5px;
    left: -45px
}

.weather34-rainrate-bar {
    background: 0;
    position: absolute;
    height: 100px;
    width: 30px;
    margin-left: 230px;
    margin-top: 38px
}

.weather34-rainrate-bar .bar {
    background: url(rain/rainrulerw34.svg) no-repeat;
    width: 37px;
    border: 1px solid rgba(71, 75, 78, 1);
    border-bottom: 5px solid rgba(71, 75, 78, 1);
    border-top: 4px solid rgba(71, 75, 78, .5);
    -webkit-border-radius: 1px 1px 2px 2px;
    position: absolute;
    bottom: 0
}

.weather34-rainrate-bar .bar-1 {
    height: 100px;
    max-height: 100px
}

.weather34-rainrate-bar .bar-inner {
    shape-rendering: crispEdges;
    background: url(rain/water.svg);
    width: 100%;
    -webkit-border-radius: 1px 1px 3px 3px;
    border: 0
}

.main-menu,
.main-menu:hover,
nav.main-menu.expanded {
    background: rgba(42, 46, 51, .95);
    overflow: hidden;
    opacity: 1
}

.weather34rainrate {
    color: #01a4b4;
    position: absolute;
    margin-left: 232px;
    margin-top: 20px;
    font-size: 12px;
    font-family: weathertext, arial, system;
    max-height: 100px
}

.weather34rainrate span {
    color: #666;
    font-family: weathertext, arial, system
}

.rainannual {
    margin-left: 3px;
    margin-top: 35px;
    color: #aaa;
    font-family: arial, system;
    width: 70px;
    border: 1px solid rgba(71, 75, 78, .5);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    font-size: 12px;
    padding: 3px
}

rainblue {
    color: #01a4b4;
    font-size: 12px
}

raingrey {
    color: #aaa;
    font-size: 10px;
    font-weight: 400
}

.rainblue1,
rainblue1 {
    color: #01a4b4;
    font-size: 10px
}

.rainblue1 {
    bototm: 5px
}

.windgrey1 {
    color: #ff8841;
    font-size: 10px;
    top: 3px;
    left: 0
}

.windsvg {
    top: 3px;
    margin-right: 5px;
    left: 0;
    padding: 3px
}

.circlelightning3 {
    width: 43px;
    height: 43px;
    top: 34px;
    border: none;
    color: #ff8841;
    position: absolute;
    line-height: 30px
}

.main-menu:hover,
.settings,
nav.main-menu.expanded {
    width: 250px
}

.main-menu .nav-text,
.main-menu li>a,
.settings {
    font-size: 12px;
    font-family: Arial, system
}

oblueh1,
ogreenh1,
ogrey,
ogreyh1,
oorangeh1,
oredh1 {
    font-family: weathertext, Arial, Helvetica
}

.settings {
    height: 73px;
    float: right;
    margin: 0;
    font-size: 20px
}

.main-menu,
.main-menu li>a,
.main-menu menu {
    font-size: 12px;
    color: #aaa
}

.main-menu {
    position: absolute;
    top: 0;
    bottom: 0;
    height: 100%;
    left: 0;
    width: 60px;
    z-index: 10;
    -webkit-border-bottom-right-radius: 4px;
    -moz-border-radius-bottomright: 4px;
    border-bottom-right-radius: 4px
}

.main-menu li,
.main-menu li>a {
    width: 250px;
    position: relative
}

.main-menu menu {
    position: relative;
    padding-left: 5px;
    display: inline;
    top: 5px;
    font-weight: 400
}

.main-menu>ul {
    margin: 5px 0
}

.main-menu li {
    display: block;
    color: #aaa;
    font-weight: 400
}

.main-menu li>a {
    display: table;
    border-collapse: collapse;
    border-spacing: 0;
    border-top: 0 solid rgba(37, 41, 45, .7);
    float: left;
    font-weight: 400
}

.main-menu a {
    color: #aaa;
    font-weight: 400
}

.main-menu .nav-text {
    position: relative;
    display: table-cell;
    width: 190px;
    float: left;
    margin-left: 60px;
    color: #aaa
}

.no-touch .scrollable.hover {
    overflow-y: hidden;
    display: none
}

.no-touch .scrollable.hover:hover {
    overflow-y: auto;
    overflow: visible;
    display: none
}

nav {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    color: #aaa
}

nav li,
nav ul {
    outline: 0;
    margin: 0;
    padding: 0;
    text-transform: none;
    float: left;
    text-align: left;
    color: #aaa
}

.active a.area {
    float: left;
    background-color: rgba(37, 41, 45, .7);
    width: 100%;
    height: 100%;
    color: #aaa
}

.menu34 a,
ogreenh1 {
    color: #9aba2f
}

@media screen and (max-width:1024px) {
    .main-menu {
        background: 0 0
    }
}

@media screen and (max-width:768px) {
    .main-menu {
        background: 0 0
    }
}

@media screen and (max-width:640px) {
    .main-menu {
        background: 0 0
    }
}

@media screen and (max-width:320px) {
    .main-menu {
        background: 0 0
    }
}

.menu34 {
    bottom: 0;
    font-size: 10px;
    text-transform: lowercase;
    text-align: center;
    border: 1px solid #777;
    padding: 3px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    width: 150px
}

.w34uptime,
ogrey,
ogreyh1 {
    -webkit-border-radius: 3px
}

.aqigood,
.aqimod,
.aqipoor,
.aqixpoor {
    padding-top: 3px;
    font-weight: 700;
    font-family: weathertext;
    width: 36px;
    height: 36px;
    line-height: 40px;
    margin-top: 0;
    text-align: center;
    color: #fff;
    position: absolute
}

.aqigood,
.aqimod {
    margin-left: 5px
}

oblueh1 {
    color: #01a4b4
}

oorangeh1 {
    color: #ff8841
}

oredh1 {
    color: #e47769
}

ogrey,
ogreyh1 {
    color: #aaa;
    background: rgba(86, 95, 103, .4);
    padding: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    font-size: .9em
}

.aqigood,
uv0 {
    background-color: #9aba2f
}

.aqigood {
    border-radius: 50%;
    border: 0;
    font-size: 13px
}

.aqimod,
.aqipoor {
    border-radius: 50%;
    font-size: 13px
}

.aqimod {
    background-color: #cda51b;
    border: 0
}

.aqipoor,
.aqixpoor {
    margin-left: 3px
}

.aqipoor {
    background-color: #ff8841;
    border: 0
}

.aqixpoor {
    background-color: #e47769;
    border-radius: 50%;
    border: 0;
    font-size: 14px
}

aqigrey {
    font-family: Arial;
    position: absolute;
    font-size: 12px;
    color: #fff;
    margin-left: 8px;
    display: block;
    margin-top: -53px;
    margin-bottom: 7px;
    font-weight: 600
}

.aqi1112a,
.aqi1113a,
.aqi67a,
.aqi810a {
    margin-left: 40px;
    width: 60px;
    height: 60px;
    text-align: center
}

aqit {
    font-size: 6pt;
    color: #fff
}

.aqi01a,
.aqi03a,
.aqi1112a,
.aqi1113a,
.aqi35a,
.aqi67a,
.aqi810a {
    padding-top: 3%;
    margin-top: -5px
}

.aqi01a,
.aqi03a {
    width: 60px;
    height: 60px;
    text-align: center;
    font-weight: 400
}

.aqi1112a span,
.aqi1113a span,
p {
    color: #aaa
}

.aqi01a {
    color: #777
}

.aqi03a,
.aqi35a {
    border: 2px solid rgba(57, 61, 64, 1)
}

.aqi1112a,
.aqi67a,
.aqi810a {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1)
}

.aqi03a {
    color: #9aba2f
}

.aqi35a,
.aqi67a {
    font: 2em weathertext, arial, system
}

.aqi35a,
.aqi67a,
spaneboltek {
    font-weight: 400
}

.aqi35a {
    color: rgba(255, 112, 50, 1);
    width: 60px;
    height: 60px;
    text-align: center
}

.aqi67a {
    color: #cda51b
}

.aqi810a {
    font: 2em weathertext, arial, system;
    color: #ff8841;
    font-weight: 400
}

.aqi1112a {
    color: #e47769;
    font-weight: 400
}

.aqi1113a {
    font: 1.9em weathertext, arial, system;
    color: #a475cb;
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    font-weight: 400
}

.ozonegood,
.ozonemoderate,
.ozoneverygood,
.rainrateblue,
.raintodayblue,
body {
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased
}

aqia,
aqialo,
aqiap {
    font-size: .3em;
    position: absolute;
    text-align: center;
    color: #aaa
}

aqia {
    margin: 30px auto 0 -37px
}

aqiap {
    margin: 30px auto 0 -35px
}

aqialo {
    margin: 30px auto 0 -31px
}

.ozonegood,
.ozonemoderate,
.ozonepoor,
.ozoneverygood {
    margin-left: 40px;
    width: 60px;
    height: 60px;
    margin-top: 10px
}

.ozonegood,
.ozonepoor {
    line-height: 14px;
    color: #aaa;
    font-family: Arial, system
}

.ozonepoor {
    padding-top: 18px
}

.ozonegood,
.ozonemoderate,
.ozoneverygood {
    -moz-osx-font-smoothing: grayscale;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    position: absolute
}

.ozonedark {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    padding-top: 15px;
    font-size: 12px;
    font-weight: 400
}

.ozonegood,
.ozonelow,
.ozonemoderate,
.ozoneverygood {
    padding-top: 18px;
    font-family: Arial, system;
    line-height: 14px
}

.ozonelow {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    font-size: 18px;
    font-weight: 600;
    color: #01a4b4
}

.ozonegood,
.ozonemoderate {
    font-weight: 400;
    font-size: 18px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%
}

.ozonemoderate {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #ff8841
}

.ozonegood {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #9aba2f
}

.ozonepoor {
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    color: #e47769
}

.ozoneverygood {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    border: 2px solid rgba(57, 61, 64, 1);
    font-size: 18px;
    color: #9aba2f
}

infogrey {
    color: #aaa
}

.wu34i {
    background: 0;
    color: #777
}

.wu34i p:first-of-type {
    position: relative;
    border: 1px solid #333;
    width: 90px;
    display: inline-block;
    padding: 4px;
    border-radius: 4px;
    margin: 3px;
    float: left;
    height: 145px;
    color: #aaa;
    background: rgba(37, 41, 45, .7);
    background: -moz-linear-gradient(top, rgba(37, 41, 45, .7) 0, rgba(37, 41, 45, .7) 40%, rgba(32, 34, 38, .4) 40%, rgba(32, 34, 38, .4) 100%);
    background: -webkit-linear-gradient(top, rgba(37, 41, 45, .7) 0, rgba(37, 41, 45, .7) 40%, rgba(32, 34, 38, .4) 40%, rgba(32, 34, 38, .3) 100%);
    background: linear-gradient(to bottom, rgba(37, 41, 45, .7) 0, rgba(37, 41, 45, .7) 40%, rgba(32, 34, 38, .4) 40%, rgba(32, 34, 38, .4) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='rgba(37,41,45,0.7)', endColorstr='rgba(32,34,38,0.4)', GradientType=0)
}

adv,
adv1 {
    left: 40px;
    margin-top: 5px;
    font-size: 12px
}

.apixuforecast34,
adv,
adv1 {
    display: block
}

bluefi,
hiti,
lowti,
orangefi {
    padding: 2px;
    font-weight: 700
}

.weather34solarrate,
adv1,
solarwm2,
wfblue,
wfgreen {
    font-weight: 400
}

bluefi,
chancei,
lowti {
    color: #01a4b5;
    font-size: 12px
}

hiti,
orangefi {
    color: #ff8841;
    font-size: 12px
}

greenfi {
    color: #9aba2f
}

greyfi {
    font-size: 12px
}

dayi,
raini,
rainui,
tempui,
windui {
    font-size: 12px;
    font-family: Arial, Helvetica
}

.menucolor {
    color: #e47769
}

windred {
    color: #d86858
}

windorange {
    color: #ff8841
}

windgreen {
    color: #9aba2f
}

adv1 {
    font-family: Arial, Helvetica
}

.weather34solarrate,
.weather34solarrate span {
    font-family: weathertext, arial, system;
    font-size: 12px
}

.weather34-solarrate-bar {
    background: 0;
    position: absolute;
    height: 100px;
    width: 30px;
    margin-left: 20px;
    margin-top: 40px;
    color: rgba(57, 61, 64, 1)
}

.weather34solarrate {
    color: #ff8841;
    position: absolute;
    margin-left: 36px;
    margin-top: 27px;
    width: 20px;
    max-height: 100px;
    line-height: 10px
}

.weather34solarrate span {
    color: #777
}

solarwm2 {
    font-size: 10px
}

.weather34solarrate1,
.weather34solarrate1 span,
.weather34uvrate,
.weather34uvrate span {
    font-family: weathertext, arial, system;
    font-size: 12px;
    font-weight: 400
}

.weather34-solarrate1-bar {
    background: 0;
    position: absolute;
    height: 100px;
    width: 30px;
    margin-left: 230px;
    margin-top: 38px
}

.weather34-solarrate1-bar .bar {
    shape-rendering: crispEdges;
    background: url(rain/solarrulerw34.svg) no-repeat;
    width: 37px;
    border: 1px solid rgba(57, 61, 64, 1);
    border-bottom: 5px solid rgba(57, 61, 64, 1);
    border-top: 3px solid rgba(57, 61, 64, 1);
    -webkit-border-radius: 1px 1px 2px 2px;
    position: absolute;
    bottom: 0
}

.weather34-solarrate1-bar .bar-1 {
    height: 100px;
    max-height: 100px
}

.weather34-solarrate1-bar .bar-inner1000 {
    shape-rendering: crispEdges;
    background: rgba(128, 105, 152, .8);
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px;
    border: 0
}

.weather34-solarrate1-bar .bar-inner700 {
    shape-rendering: crispEdges;
    background: rgba(174, 81, 82, .8);
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px;
    border: 0
}

.weather34-solarrate1-bar .bar-inner1,
.weather34-solarrate1-bar .bar-inner400,
.weather34-solarrate1-bar .bar-inner600 {
    shape-rendering: crispEdges;
    background: rgba(191, 115, 55, 1);
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px;
    border: 0
}

.weather34solarrate1 {
    color: #ff8841;
    position: absolute;
    margin-left: 238px;
    margin-top: 17px;
    width: 20px;
    max-height: 100px;
    line-height: 10px
}

.weather34solarrate1 span {
    color: #777
}

.weather34-uvrate-bar {
    background: 0;
    position: absolute;
    height: 100px;
    width: 30px;
    margin-left: 230px;
    margin-top: 38px
}

.weather34-uvrate-bar .bar {
    shape-rendering: crispEdges;
    background: url(rain/uvrulerw34.svg) no-repeat;
    width: 37px;
    border: 1px solid rgba(57, 61, 64, 1);
    border-bottom: 5px solid rgba(57, 61, 64, 1);
    border-top: 3px solid rgba(57, 61, 64, 1);
    -webkit-border-radius: 1px 1px 2px 2px;
    position: absolute;
    bottom: 0
}

.weather34-uvrate-bar .bar-inner10,
.weather34-uvrate-bar .bar-inner8 {
    shape-rendering: crispEdges;
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px
}

.daylightcompass2>.daylightcompass-line2,
.homeweathercompass2>.homeweathercompass-line2 {
    -webkit-clip-path: polygon(100%0, 100%100%, 100%100%, 0100%, 00);
    -ms-clip-path: polygon(100%0, 100%100%, 100%100%, 0100%, 00);
    bottom: 25px
}

.weather34-uvrate-bar .bar-1 {
    height: 100px;
    max-height: 100px
}

.weather34-uvrate-bar .bar-inner10 {
    background: rgba(128, 105, 152, .6);
    border: 0
}

.weather34-uvrate-bar .bar-inner8 {
    background: rgba(174, 81, 82, .6);
    border: 0
}

.weather34-uvrate-bar .bar-inner3,
.weather34-uvrate-bar .bar-inner5 {
    -webkit-border-radius: 1px 1px 2px 2px;
    width: 100%;
    shape-rendering: crispEdges
}

.weather34-uvrate-bar .bar-inner5 {
    background: rgba(255, 136, 65, .6);
    border: 0
}

.weather34-uvrate-bar .bar-inner3 {
    background: rgba(221, 181, 73, .6);
    border: 0
}

.weather34-uvrate-bar .bar-inner {
    shape-rendering: crispEdges;
    background: rgba(143, 177, 42, .6);
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px;
    border: 0
}

.weather34uvrate {
    color: #ff8841;
    position: absolute;
    margin-left: 238px;
    margin-top: 17px;
    width: 20px;
    max-height: 100px;
    line-height: 10px
}

.weather34uvrate span {
    color: #777
}

greyuv,
solartrend {
    color: #aaa
}

purpleuv {
    color: #a475cb
}

reduv {
    color: #e47769
}

orangeuv {
    color: #ff8841
}

greenuv {
    color: #9aba2f
}

rainrateblue {
    color: #01a4b4
}

.apixuforecast34block {
    margin-left: 10px
}

.apixuforecast34 {
    float: left;
    width: 30%;
    margin: 2px 2px 2px 3px;
    font-family: ' Helvetica', Arial;
    height: 145px;
    padding: 5px;
    color: #aaa;
    background: rgba(37, 41, 45, .7);
    background: -moz-linear-gradient(to top, rgba(37, 41, 45, .7) 0, rgba(37, 41, 45, .7) 64%, rgba(32, 34, 38, .4) 64%, rgba(32, 34, 38, .4) 100%);
    background: -webkit-linear-gradient(to top, rgba(37, 41, 45, .7) 0, rgba(37, 41, 45, .7) 64%, rgba(32, 34, 38, .4) 64%, rgba(32, 34, 38, .4) 100%);
    background: linear-gradient(to top, rgba(37, 41, 45, .7) 0, rgba(37, 41, 45, .7) 64%, rgba(32, 34, 38, .4) 64%, rgba(32, 34, 38, .4) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='rgba(37,41,45,0.7)', endColorstr='rgba(32,34,38,0.4)', GradientType=1);
    border: 1px solid rgba(153, 155, 156, .2);
    line-height: 13px;
    font-size: 12px
}

uppercase {
    text-transform: capitalize
}

greenf {
    color: #9aba2f;
    font-size: 12px;
    padding: 2px;
    font-weight: 700
}

solartrend {
    position: absolute;
    margin-left: 15px;
    margin-top: -15px
}

uvtrend {
    position: absolute;
    margin-left: 5px;
    margin-top: -5px
}

.tempblue,
.tempgreen,
.temporange,
.tempred {
    margin-top: -17px;
    float: left;
    width: 60px
}

.metricsymbol {
    position: absolute;
    top: 15px;
    left: 81px
}

.tempblue,
.tempbluedew,
.tempgreen,
.tempgreendew,
.temporange,
.temporangedew,
.tempred,
.tempreddew {
    position: relative;
    background: 0;
    padding: 1px;
    border-radius: 4px;
    margin-left: 35px
}

yellow,
yellow1 {
    color: rgba(230, 161, 65, 1)
}

.tempgreen {
    font-weight: 400;
    color: #aaa
}

.tempgreen span {
    font-weight: 600;
    color: #9aba2f
}

.temporange {
    font-weight: 400;
    color: #aaa
}

.temporange span {
    font-weight: 600;
    color: #ff8841
}

.tempred {
    font-weight: 400;
    color: #aaa
}

.tempred span {
    font-weight: 600;
    color: #e47769
}

.tempblue {
    font-weight: 400;
    color: #aaa
}

.tempblue span {
    font-weight: 600;
    color: #01a4b4
}

.tempbluedew,
.tempgreendew,
.temporangedew,
.tempreddew {
    font-weight: 400;
    color: #aaa;
    margin-top: -5px;
    float: left;
    width: 60px
}

.tempbluefeels,
.tempgreenfeels,
.temporangefeels,
.tempredfeels {
    position: relative;
    background: 0;
    padding: 1px;
    border-radius: 4px;
    margin-left: 44px;
    float: left;
    width: 60px;
    margin-bottom: 8px;
    margin-top: 0
}

.tempgreenfeels {
    font-weight: 400;
    color: #aaa
}

.tempgreenfeels span {
    font-weight: 600;
    color: #9aba2f
}

.temporangefeels {
    font-weight: 400;
    color: #aaa
}

.temporangefeels span {
    font-weight: 600;
    color: #ff8841
}

.tempredfeels {
    font-weight: 400;
    color: #aaa
}

.tempredfeels span {
    font-weight: 600;
    color: #e47769
}

.tempbluefeels {
    font-weight: 400;
    color: #aaa
}

.tempbluefeels span {
    font-weight: 600;
    color: #01a4b4
}

.tempgreendew span {
    font-weight: 600;
    color: #9aba2f
}

.temporangedew span {
    font-weight: 600;
    color: #ff8841
}

.tempreddew span {
    font-weight: 600;
    color: #e47769
}

.tempbluedew span {
    font-weight: 600;
    color: #01a4b4
}

.barometerblue,
.barometerorange {
    font-weight: 400;
    color: #aaa;
    background: 0;
    width: 60px;
    line-height: 10px;
    position: relative;
    border-radius: 4px;
    padding: 1px;
    float: left
}

.barometerblue {
    margin-top: 5px
}

.barometerorange {
    margin-top: 0;
    margin-left: 0
}

.barometerblue {
    margin-left: 5px
}

.barometerorange span {
    font-weight: 600;
    color: rgba(255, 112, 50, 1)
}

.barometerblue span {
    font-weight: 600;
    color: #01a4b4
}

.barometergreen {
    position: relative;
    font-weight: 400;
    color: #fff;
    background: rgba(144, 177, 42, 1);
    padding: 1px;
    border-radius: 4px;
    margin-top: 0;
    margin-left: 120px;
    float: left;
    width: 60px
}

.daylightblue,
.daylightred,
.moonrisered,
.moonsetblue {
    position: relative;
    width: 65px;
    line-height: 10px;
    margin-top: 0
}

.barometergreen span,
.barometergreen supunit {
    font-weight: 600;
    color: #fff
}

.daylightblue,
.daylightgreen span,
.daylightred,
.daylightred span {
    font-weight: 400;
    color: #aaa
}

.daylightblue,
.daylightred {
    background: 0;
    padding: 1px;
    border-radius: 4px;
    margin-left: 20px;
    float: left
}

.moonrisered,
.moonrisered span,
.moonsetblue {
    font-weight: 600;
    color: #fff
}

.moonrisered {
    background: rgba(255, 124, 57, 1);
    padding: 1px;
    border-radius: 4px;
    margin-left: 0;
    float: left
}

.moonsetblue {
    background: rgba(0, 154, 171, .7);
    padding: 1px;
    border-radius: 4px;
    margin-left: 10px;
    float: left
}

.rainrateblue,
.raintodayblue {
    position: relative;
    background: 0;
    border-radius: 4px;
    font-family: weathertext, arial, system;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    padding: 1px;
    float: left
}

,
.nextmoonrise,
.nextmoonset {
    font-weight: 600;
    color: #fff;
    text-align: center
}

.rainrateblue {
    font-weight: 400;
    color: #01a4b4;
    margin-top: 0;
    margin-left: -5px;
    width: 45px;
    font-size: 12px
}

.rainrateblue span {
    font-weight: 400;
    color: #aaa;
    font-size: 10px
}

.raintodayblue {
    font-weight: 400;
    color: #01a4b4;
    margin-top: -7px;
    margin-left: 5px;
    width: 55px;
    font-size: 14px
}

.raintodayblue span,
todayrain {
    font-weight: 400;
    color: #aaa;
    font-size: 12px
}

trising {
    color: #ff8841
}

tfalling {
    color: #01a4b4
}

tsteady {
    color: #9aba2f
}

.homeweathercompass2 {
    position: absolute;
    width: 175px;
    height: 175px;
    margin-top: -30px;
    margin-left: 60px
}

.homeweathercompass2>.homeweathercompass-line2 {
    right: 25px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    position: absolute;
    z-index: 10;
    left: 25px;
    top: 25px;
    width: 170px;
    height: 170px;
    border: 8px solid rgba(61, 64, 66, .7);
    border-top: 8px solid rgba(61, 64, 66, 1);
    border-right: 8px solid rgba(61, 64, 66, 1);
    border-radius: 50%;
    border-bottom-color: transparent;
    border-left-color: transparent;
    transform: rotate(-45deg);
    margin: auto
}

.homeweathercompass2 {
    display: block;
    text-align: center;
    color: #aaa;
    font-family: Arial, system;
    font-weight: 600;
    line-height: 12px;
    font-size: 12px;
    z-index: 10;
    margin: 25px 0 auto 40px
}

.thearrow3,
.thearrow4,
.thearrow7 {
    z-index: 200;
    -webkit-transform-origin: 50% 100%;
    -moz-transform-origin: 50% 100%
}

.text2,
.text3 {
    font-family: weathertext, Arial;
    font-weight: 400
}

.text2 {
    font-size: 20px;
    margin-left: 35px;
    margin-top: 75px;
    color: #ff8841
}

.pressuretext {
    position: absolute;
    font-size: 13px;
    color: #aaa;
    margin-top: -20px;
    margin-left: 33px;
    width: 80px;
    background: rgba(61, 64, 66, .2);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    text-align: center
}

.text2 span,
.text3 {
    font-size: 12px;
    color: #aaa
}

.text3 {
    position: relative;
    margin-left: 5px;
    margin-top: 45px;
    float: left
}

.barometertrend2 {
    position: absolute;
    font-weight: 400;
    color: #aaa;
    background: 0;
    padding: 1px;
    border-radius: 4px;
    margin-top: 124px;
    margin-left: 10px;
    float: left;
    width: 60px;
    line-height: 10px;
    font-size: 10px
}

.thearrow3 {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -5px;
    width: 10px;
    height: 50%;
    -o-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

.thearrow3:after,
.thearrow4:after,
.thearrow7:after {
    -webkit-transform: translate(-50%, -50%)
}

.barometertrend2 span {
    font-weight: 600;
    color: #9aba2f
}

.barometerconv {
    width: 70px;
    font: 10px arial, system;
    line-height: 10px;
    margin-top: 130px;
    position: absolute;
    text-align: center;
    color: #9aba2f;
    font-weight: 600
}

.barometerlimits,
.hoursgoneby {
    position: absolute;
    font-size: 12px
}

.barometerconv span,
convtext {
    color: #aaa;
    display: block;
    font-weight: 400
}

.barometerlimits {
    margin-top: 57px;
    margin-left: 16px;
    width: 235px;
    color: #777;
    font-weight: 400;
    font-family: Helvetica, Arial
}

.thearrow3:after {
    position: absolute;
    left: 50%;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 14px 9px 0;
    border-color: rgba(255, 121, 58, 1) transparent transparent;
    transform: translate(-50%, -50%)
}

.thearrow3:before {
    width: 6px;
    height: 6px;
    position: absolute;
    z-index: 9;
    left: 2px;
    top: -5px;
    border: 2px solid rgba(255, 255, 255, .8);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%
}

.thearrow4:after,
.thearrow7:after {
    position: absolute;
    border-style: solid;
    border-width: 3px;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-color: #9aba2f
}

convtext {
    color: #aaa;
    font-weight: 400
}

.daylightbox,
.moonimage {
    background: 0;
    border: 0
}

#daylight {
    background: rgba(37, 41, 45, .7);
    border: 6px solid rgba(95, 96, 97, .5)
}

.hoursgoneby {
    top: 40px;
    left: 27px;
    color: #aaa;
    border: 0
}

.daylightvalue,
.daylightvalue minutes {
    font-family: weathertext, Helvetica, Arial;
    font-size: 26px;
    line-height: 20px;
    width: 100px;
    position: absolute;
    color: #aaa;
    border: 0
}

.daylightvalue {
    left: -7px;
    top: 55px;
    z-index: 1;
    background: 0
}

.daylightvalue minutes {
    left: 40px;
    z-index: auto
}

.daylightvalue span {
    position: absolute;
    color: #aaa;
    font-size: 3px;
    left: 67px;
    top: 0;
    border: 0
}

.daylightvalue period {
    position: absolute;
    font-size: 12px;
    left: 10px;
    top: 25px;
    line-height: 12px;
    width: 120px;
    border: 0;
    color: #ff8841
}

.daylightvalue dayperiod {
    position: absolute;
    color: #aaa;
    font-size: 10px;
    left: 15px;
    top: 20px;
    width: 100px;
    border: 0
}

.daylightvalue hrs,
.daylightvalue min {
    position: absolute;
    color: #aaa;
    font-size: 9px;
    top: -17px;
    letter-spacing: normal
}

.daylightvalue min {
    left: 85px
}

.daylightvalue hrs {
    left: 40px
}

.hrstillsunset,
.hrswassunrise {
    width: 100px;
    position: absolute;
    font-size: 10px;
    margin-left: 120px
}

.daylightvalue:before {
    color: #9aba2f
}

.hrswassunrise {
    margin-top: -120px;
    line-height: 12px
}

.hrstillsunset {
    margin-top: -20px;
    line-height: 12px
}

.sunrisehome,
.sunsethome {
    width: 100px;
    font-size: 10px;
    margin-left: -95px;
    line-height: 12px;
    position: absolute
}

.sunrisehome {
    margin-top: -120px
}

.sunsethome {
    margin-top: -20px
}

.weather34menulisting {
    width: 250px;
    background: rgba(37, 41, 45, .7);
    padding: 5px;
    color: #aaa;
    height: 800px;
    position: absolute;
    left: 0;
    overflow: hidden;
    top: -800px;
    font-size: 14px
}

.weather34menulistings {
    position: relative;
    margin-top: 50px;
    list-style: none;
    line-height: 25px;
    float: left;
    text-align: left;
    margin-left: 5px;
    font-weight: 400;
    color: #aaa
}

.sunlightday,
.sunriseday {
    margin-left: 0;
    text-align: center
}

.weather34menulistings a {
    font-weight: 400;
    color: #aaa
}

.weather34menulistings a:hover {
    font-weight: 400;
    color: #9aba2f
}

.weather34menulistings p {
    height: 3px;
    margin-top: -15px
}

.weather34menulistings underline {
    font-family: Arial, system;
    font-weight: 700;
    font-size: 12px
}

.daylightvalue1,
.daylightvalue1 minutes {
    font-family: weathertext, Helvetica, Arial;
    font-size: 26px;
    line-height: 20px;
    border: 0;
    position: absolute;
    color: #aaa
}

@media screen and (max-width:768px) {
    header {
        display: block;
        height: 0
    }
    .clock-container,
    .homeindoordate,
    .menuclock,
    .w34logo,
    oblueh1,
    ogreenh1,
    ogreyh1 {
        display: none
    }
    .newweather34menu {
        width: 30px;
        height: 24px;
        display: block;
        cursor: pointer;
        top: 3px;
        left: 60px;
        position: absolute;
        z-index: 1;
        background: 0 0;
        border: 0
    }
}

@media screen and (max-width:480px) {
    header {
        display: block;
        height: 0
    }
    .clock-container,
    .homeindoordate,
    .menuclock,
    .w34logo,
    oblueh1,
    ogreenh1,
    ogreyh1 {
        display: none
    }
    .newweather34menu {
        width: 30px;
        height: 24px;
        display: block;
        cursor: pointer;
        top: 3px;
        left: 15px;
        position: absolute;
        z-index: 1;
        background: 0 0;
        border: 0
    }
}

strongnumbers {
    font-weight: 600
}

.daylightvalue1 {
    left: 0;
    z-index: 1;
    width: 100px;
    background: 0;
    font-weight: 400;
    margin-top: 25px
}

.daylightvalue1 minutes {
    left: 40px;
    z-index: auto;
    width: 100px
}

.daylightvalue1 period,
.daylightvalue1:before {
    font-family: Helvetica, Arial;
    background: 0
}

.daylightvalue1 span {
    border: 0
}

.daylightvalue1 dayperiod {
    font-size: 10px;
    left: 15px;
    top: 20px;
    width: 100px
}

.daylightvalue1 hrs,
.daylightvalue1 min {
    font-size: 9px;
    top: -17px;
    color: #aaa;
    letter-spacing: normal;
    position: absolute
}

.daylightvalue1 min {
    left: 85px
}

.daylightvalue1 hrs {
    left: 40px
}

.moonimage {
    color: #aaa;
    border: 0;
    position: absolute;
    left: 55px;
    top: 94px;
    font-size: 10px;
    line-height: 20px;
    z-index: 1
}

.sunlightday {
    width: 100px;
    position: absolute;
    line-height: 9px;
    margin-top: 10px;
    color: #aaa
}

.sundarkday,
.sunriseday {
    font: 10px arial, system
}

.sunriseday {
    margin-top: 125px;
    position: absolute;
    width: 100px;
    line-height: 9px;
    color: #aaa
}

.sundarkday,
.sunsetday {
    position: absolute;
    margin-left: 222px;
    text-align: center;
    width: 100px;
    color: #aaa
}

.sundarkday {
    line-height: 9px;
    margin-top: 10px
}

.sunsetday {
    margin-top: 125px;
    font: 10px arial, system;
    line-height: 9px
}

.thearrow5:before,
.thearrow5keep:before {
    font-family: weathericons;
    z-index: 999;
    position: absolute
}

.thearrow5keep:before {
    content: '\f00d \f04d ';
    top: -5px;
    font-size: 10px
}

.thearrow5:before {
    content: '\f00d ';
    margin-top: -10px;
    font-size: 16px;
    width: 20px
}

.thearrow5:after {
    position: absolute;
    left: 50%;
    top: -7px;
    background-color: NONE;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0;
    border-color: #ff8841;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    z-index: 500
}

.daylightcompass2 {
    position: absolute;
    width: 175px;
    height: 175px;
    margin-top: -30px;
    margin-left: 60px
}

.daylightcompass2>.daylightcompass-line2 {
    right: 25px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    position: absolute;
    z-index: 10;
    left: 25px;
    top: 25px;
    width: 170px;
    height: 170px;
    border: 4px dotted rgba(61, 64, 66, .7);
    border-top: 4px dotted rgba(61, 64, 66, 1);
    border-right: 4px dotted rgba(61, 64, 66, 1);
    border-radius: 50%;
    border-bottom-color: transparent;
    border-left-color: transparent;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    margin: auto
}

.daylightcompass2 {
    display: block;
    text-align: center;
    color: #aaa;
    font-family: Arial, system;
    font-weight: 600;
    line-height: 12px;
    font-size: 12px;
    z-index: 10;
    margin: 25px 0 auto 40px
}

wfblue,
wfgreen,
wforange,
wfred {
    font-size: 15px
}

.orangealerticon {
    margin-top: -57px;
    margin-left: 160px;
    background: 0;
    padding: 4px;
    line-height: 20px;
    position: relative
}

.clock-container,
.timeago,
.uvimax,
.weather34-aqi-bar,
.weather34-aqi-bar .bar,
.weather34-luxrate-bar,
.weather34aqi,
.weather34i-uvrate-bar,
.weather34i-uvrate-bar .bar,
.weather34luxrate,
luxrate,
memclock,
smallicon {
    position: absolute
}

windchill {
    color: #01a4b4
}

.zam {
    color: #aaa;
    padding: 5px;
    border-radius: 4px;
    border: 1px solid #444;
    line-height: 16px;
    margin-left: -5px
}

smallicon {
    margin-top: -12px;
    margin-left: 10px;
    color: #aaa
}

.timeago {
    display: inline;
    margin-top: 12px;
    width: 100px;
    height: 15px;
    left: 80px
}

aurora {
    color: #aaa
}

wforange {
    color: #ff8841
}

wfgreen {
    color: #9aba2f
}

wfblue {
    color: #01a4b4
}

wfred {
    color: #e47769
}

.weather34i-uvrate-bar {
    background: 0;
    height: 100px;
    width: 130px;
    margin-left: 105px;
    margin-top: 38px
}

.weather34i-uvrate-bar .bar {
    shape-rendering: crispEdges;
    background: url(rain/uvmarker.svg) no-repeat;
    width: 90px;
    border: 1px solid rgba(57, 61, 64, 1);
    border-bottom: 5px solid rgba(57, 61, 64, 1);
    border-top: 3px solid rgba(57, 61, 64, 1);
    -webkit-border-radius: 1px 1px 2px 2px;
    bottom: 0
}

.weather34i-uvrate-bar .bar-inner10,
.weather34i-uvrate-bar .bar-inner8 {
    shape-rendering: crispEdges;
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px
}

.weather34i-uvrate-bar .bar-1 {
    height: 100px;
    max-height: 100px
}

.weather34i-uvrate-bar .bar-inner10 {
    background: rgba(128, 105, 152, .4);
    border: 0
}

.weather34i-uvrate-bar .bar-inner8 {
    background: rgba(174, 81, 82, .6);
    border: 0
}

.weather34i-uvrate-bar .bar-inner3,
.weather34i-uvrate-bar .bar-inner5 {
    -webkit-border-radius: 1px 1px 2px 2px;
    width: 100%;
    shape-rendering: crispEdges
}

.weather34i-uvrate-bar .bar-inner5 {
    background: rgba(255, 136, 65, .6);
    border: 0
}

.weather34i-uvrate-bar .bar-inner3 {
    background: rgba(221, 181, 73, .6);
    border: 0
}

.weather34i-uvrate-bar .bar-inner {
    shape-rendering: crispEdges;
    background: rgba(143, 177, 42, .6);
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px;
    border: 0
}

.weather34todayraintext {
    -o-border-radius: 50%;
    -ms-border-radius: 50%
}

.uv10 {
    font-family: weathertext, arial, system;
    font-weight: 400;
    background: 0;
    border: 0;
    font-size: 16px;
    line-height: 0;
    padding-top: 0
}

.weather34iuvrate span {
    color: #777;
    font-family: arial, system;
    font-size: 8px;
    font-weight: 400
}

.uvimax {
    width: 100px;
    text-align: left;
    margin-top: 140px;
    margin-left: 127px;
    color: #ff8841;
    font: 700 10px arial, system
}

.uvimax span {
    color: #aaa;
    font: 10px arial, system
}

.weather34aqi,
.weather34aqi span,
.weather34luxrate,
.weather34luxrate span,
luxrate {
    font-size: 12px;
    font-family: weathertext, arial, system
}

.weather34luxrate,
.weather34luxrate span,
luxrate {
    font-weight: 400
}

.weather34aqi,
.weather34luxrate {
    line-height: 10px;
    max-height: 100px
}

whiteuv {
    color: #ccc
}

.weather34-luxrate-bar {
    background: 0;
    height: 100px;
    width: 30px;
    margin-left: 230px;
    margin-top: 40px;
    color: rgba(57, 61, 64, 1)
}

.weather34-luxrate-bar .bar {
    shape-rendering: crispEdges;
    background: url(rain/luxrulerw34.svg) no-repeat;
    width: 37px;
    border: 1px solid rgba(57, 61, 64, 1);
    border-bottom: 5px solid rgba(57, 61, 64, 1);
    border-top: 3px solid rgba(57, 61, 64, 1);
    -webkit-border-radius: 1px 1px 2px 2px;
    position: absolute;
    bottom: 0
}

.weather34-luxrate-bar .bar-inner10,
.weather34-luxrate-bar .bar-inner8 {
    shape-rendering: crispEdges;
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px
}

.weather34-luxrate-bar .bar-1 {
    height: 100px;
    max-height: 100px
}

.weather34-luxrate-bar .bar-inner10 {
    background: rgba(128, 105, 152, .6);
    border: 0
}

.weather34-luxrate-bar .bar-inner8 {
    background: rgba(174, 81, 82, .6);
    border: 0
}

.weather34-luxrate-bar .bar-inner3,
.weather34-luxrate-bar .bar-inner5 {
    -webkit-border-radius: 1px 1px 2px 2px;
    shape-rendering: crispEdges;
    width: 100%
}

.weather34-luxrate-bar .bar-inner5 {
    background: rgba(255, 136, 65, .6);
    border: 0
}

.weather34-luxrate-bar .bar-inner3 {
    background: rgba(221, 181, 73, .6);
    border: 0
}

.weather34-luxrate-bar .bar-inner {
    shape-rendering: crispEdges;
    background: rgba(143, 177, 42, .6);
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px;
    border: 0
}

.weather34-aqi-bar,
luxrate {
    background: 0;
    width: 30px
}

.weather34luxrate span {
    color: #777
}

.menucalendar {
    margin-left: 125px;
    margin-top: 5px;
    margin-bottom: -70px;
    font-weight: 600;
    color: #fff
}

.weather34-aqi-bar {
    height: 100px;
    margin-left: 30px;
    margin-top: 38px
}

.weather34-aqi-bar .bar {
    shape-rendering: crispEdges;
    background: url(rain/aqirulerw34.svg) no-repeat;
    width: 37px;
    border: 1px solid rgba(57, 61, 64, 1);
    border-bottom: 5px solid rgba(57, 61, 64, 1);
    border-top: 3px solid rgba(57, 61, 64, 1);
    -webkit-border-radius: 1px 1px 2px 2px;
    bottom: 0
}

.weather34-aqi-bar .bar-1 {
    height: 100px;
    max-height: 100px
}

.weather34-aqi-bar .bar-inner1000,
.weather34-aqi-bar .bar-inner600,
.weather34-aqi-bar .bar-inner700 {
    shape-rendering: crispEdges;
    background: rgba(211, 93, 78, .6);
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px;
    border: 0
}

.weather34-aqi-bar .bar-inner200,
.weather34-aqi-bar .bar-inner400 {
    -webkit-border-radius: 1px 1px 2px 2px;
    width: 100%;
    shape-rendering: crispEdges
}

.weather34-aqi-bar .bar-inner400 {
    background: rgba(255, 124, 57, .6);
    border: 0
}

.weather34-aqi-bar .bar-inner200 {
    background: rgba(221, 181, 73, .6);
    border: 0
}

.weather34-aqi-bar .bar-inner1 {
    shape-rendering: crispEdges;
    background: rgba(255, 124, 57, .6);
    width: 100%;
    -webkit-border-radius: 1px 1px 2px 2px;
    border: 0
}

.weather34aqi {
    color: #ff8841;
    margin-left: 36px;
    margin-top: 17px;
    width: 20px;
    font-weight: 400
}

.weather34aqi span {
    color: #777
}

.clock-container {
    float: left;
    color: #fff;
    font: 1.1em weathertext, arial, system;
    top: 15px;
    list-style: none;
    width: 110px;
    height: 1.25em;
    right: 127px;
    border: 0;
    padding-top: 4px;
    line-height: 12px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    background: linear-gradient(90deg, rgba(154, 186, 47, 1) 18%, rgba(0, 164, 180, 1) 18%, rgba(0, 164, 180, 1) 80%);
    padding-left: 25px;
    padding-right: 5px
}

.clock-container>ul,
.weather34clock {
    display: inline;
    color: #fff;
    list-style: none;
    margin-left: -20px
}

.clock-container>ul>li,
.clock-container>ul>li>span,
.weather34clock {
    display: inline;
    list-style: none;
    margin-left: -30px
}

.clock-container>ul>li>span,
.homeweather34clock,
.menuclock,
.weather34clock {
    display: inline;
    list-style: none
}

.clock-container>ul>li>span,
.weather34clock {
    display: inline;
    margin-left: 10px
}

memclock {
    top: 3px;
    left: 2.5px;
    padding-right: 20px
}

.weather34calendarapp {
    text-align: center;
    margin-left: 180px;
    margin-bottom: -10px;
    margin-top: 5px
}

.weather34calendarapp-calendar {
    height: 60px;
    margin-bottom: 0;
    width: 50px
}

#weather34weekday {
    background: #9aba2f;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    -o-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    color: #fff;
    font-size: 12px;
    line-height: 18px;
    position: relative;
    text-transform: none;
    font-weight: 700;
    font-family: Arial, system
}

#weather34day {
    background: #01a4b4;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    -o-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    color: #fff;
    font-size: 22px;
    font-weight: 400;
    font-family: weathertext;
    height: 26px;
    line-height: 24px;
    text-align: center
}

.alertcircle,
.weather34todayraintext {
    -moz-border-radius: 50%;
    font-weight: 400
}

#weather34sidebarMenu,
.weather34sidebarMenuInner li {
    background: rgba(18, 18, 18, .7);
    width: 240px;
    float: left;
    font-weight: 400
}

#weather34sidebarMenu {
    position: absolute;
    left: 0;
    top: 0;
    transform: translateX(-250px);
    transition: transform 250ms ease-in-out;
    height: 900px;
    z-index: 30
}

.weather34sidebarIconToggle,
.weather34spinner,
input[type=checkbox] {
    transition: all .3s;
    box-sizing: border-box
}

.weather34sidebarMenuInner {
    margin: 0;
    padding: 0;
    border-top: 0;
    width: 240px;
    float: left;
    font-weight: 400
}

.weather34cross.part-2,
.weather34horizontal {
    margin-top: 3px
}

.weather34sidebarMenuInner li {
    list-style: none;
    color: #aaa;
    padding: 5px 5px 5px 10px;
    cursor: pointer;
    border-bottom: 0;
    font-size: 12px
}

.weather34sidebarMenuInner li span {
    display: block;
    font-size: 12px;
    color: #aaa;
    float: left;
    width: 240px;
    font-weight: 400
}

.weather34sidebarMenuInner li a {
    color: #aaa;
    cursor: pointer;
    text-decoration: none;
    float: left;
    font-size: 12px;
    font-weight: 400
}

.weather34sidebarMenuInner li a:hover {
    color: #ff8841;
    cursor: pointer;
    text-decoration: none;
    float: left;
    font-size: 12px;
    font-weight: 400
}

input[type=checkbox]:checked~#weather34sidebarMenu {
    transform: translateX(0)
}

input[type=checkbox] {
    display: none
}

.weather34sidebarIconToggle {
    cursor: pointer;
    position: absolute;
    z-index: 99;
    top: 22px;
    left: 15px;
    height: 22px;
    width: 22px
}

.weather34spinner {
    position: absolute;
    height: 3px;
    width: 100%;
    background-color: #aaa
}

.weather34cross.part-1,
.weather34cross.part-2,
.weather34horizontal {
    position: relative;
    transition: all .3s;
    box-sizing: border-box;
    float: left
}

.homehardwarestatus,
uptime {
    position: absolute;
    font-size: 10px;
    font-weight: 400
}

input[type=checkbox]:checked~.weather34sidebarIconToggle>.weather34horizontal {
    transition: all .3s;
    box-sizing: border-box;
    opacity: 0
}

input[type=checkbox]:checked~.weather34sidebarIconToggle>.weather34cross.part-1 {
    transition: all .3s;
    box-sizing: border-box;
    transform: rotate(135deg);
    margin-top: 8px
}

input[type=checkbox]:checked~.weather34sidebarIconToggle>.weather34cross.part-2 {
    transition: all .3s;
    box-sizing: border-box;
    transform: rotate(-135deg);
    margin-top: -9px
}

.cclicencelogo {
    margin: 0;
    padding: 5px;
    float: left
}

uptime {
    left: 50px;
    padding-top: 5px;
    top: 65px
}

.homehardwarestatus {
    margin-left: 65px;
    top: 3px;
    color: #aaa;
    font-family: arial, system;
    width: 200px
}

.lightdistance,
.lighttime {
    color: #ff8841;
    position: absolute
}

.indicator,
.maxyesterday,
.todaymax,
yesterdaytimemax {
    color: #aaa;
    position: absolute
}

.lighttime {
    margin-left: 80px;
    top: 50px
}

.lightdistance {
    margin-left: 55px;
    top: 30px
}

.indicator {
    font-size: .8em;
    float: left;
    width: 100px;
    line-height: 25px;
    top: 0;
    left: 5px
}

.alertcircle {
    font-size: 16px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    position: absolute;
    top: 40px;
    border: .12rem solid rgba(95, 96, 97, .9);
    line-height: 39px;
    font-family: weathertext, arial, helvetica
}

rainc,
rainf {
    font-size: 15px
}

.maxyesterday {
    font-size: 9px;
    top: -12px;
    left: 13px
}

.todaymax,
yesterdaytimemax {
    font-size: 12px
}

.yesterdaymax {
    position: absolute;
    top: 0;
    left: 25px
}

.yesterdaymin {
    position: absolute;
    top: 0;
    left: 125px
}

yesterdaytimemax {
    top: 15px;
    left: 15px
}

.todaymax {
    top: 62px;
    left: -15px;
    width: 250px;
    float: left
}

.weather34-rrrate-bar {
    position: absolute;
    height: 100px;
    width: 30px;
    margin-left: 237px;
    margin-top: 40px;
    color: rgba(57, 61, 64, 1)
}

rainu {
    font-size: 10px;
    font-weight: 400;
    color: #aaa;
    left: 3px;
    padding-left: 0
}

.almanac,
.rainannual1 {
    font-size: 11px;
    color: #aaa;
    position: absolute;
    line-height: 14px
}

.rainannual1 {
    margin-left: 5px;
    margin-top: 23px;
    font-family: arial, system;
    width: 70px;
    border: 1px solid rgba(71, 75, 78, .5);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    padding: 3px
}

.almanac {
    font-weight: 400;
    top: -18px;
    margin-left: 7px;
    background: rgba(97, 106, 114, .2);
    padding: 0 2px;
    border-radius: 2px
}

.weather34i-rairate-bar {
    background: 0;
    position: absolute;
    height: 100px;
    width: 130px;
    margin-left: 115px;
    margin-top: 38px
}

#raincontainer {
    height: 170px;
    overflow: hidden;
    position: absolute;
    width: 208px;
    margin-top: -70px;
    left: -20px
}

#raincontainer div {
    position: absolute
}

#weather34rainbeaker {
    border: 4px solid rgba(57, 61, 64, 1);
    border-top: 0;
    -webkit-border-radius: 0 0 2px 2px;
    -moz-border-radius: 0 0 2px 2px;
    -o-border-radius: 0 0 2px 2px;
    -ms-border-radius: 0 0 2px 2px;
    border-radius: 0 0 2px 2px;
    height: 100px;
    left: 14px;
    bottom: 0;
    width: 100px;
    background: url(rain/rainmarker.svg) no-repeat
}

#weather34rainbeaker:after,
#weather34rainbeaker:before {
    border: 4px solid rgba(57, 61, 64, 1);
    border-bottom: 0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    content: '';
    height: 5px;
    position: absolute;
    top: 0;
    width: 10px
}

#weather34rainbeaker:before {
    left: -10px
}

#weather34rainbeaker:after {
    right: -10px
}

#weather34rainwater {
    background-color: rgba(0, 154, 171, .6);
    border: 0;
    -webkit-border-radius: 0 0 2px 2px;
    -moz-border-radius: 0 0 2px 2px;
    -o-border-radius: 0 0 2px 2px;
    -ms-border-radius: 0 0 2px 2px;
    border-radius: 0 0 2px 2px;
    bottom: 0;
    max-height: 90px;
    overflow: hidden;
    width: 92px
}

.weather34todayraintext {
    color: rgba(0, 154, 171, 1);
    position: absolute;
    margin-left: 137px;
    margin-top: 59px;
    font-family: weathertext, arial, system;
    max-height: 42px;
    background: rgba(37, 41, 45, .7);
    width: 2.7rem;
    height: 2.7rem;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    font-size: 15px;
    line-height: 10px;
    padding-top: 14px;
    border: .12rem solid rgba(95, 96, 97, .9)
}

.circlewftodayemperature,
.circleyestemperature {
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    width: 2.7rem
}

.weather34todayraintext span {
    color: #777;
    font-family: arial, system;
    font-size: 8px;
    font-weight: 400
}

.wfstrikes,
.wftemp {
    color: #aaa;
    position: absolute
}

.circlewflightningtoday,
.circlewftodayemperature,
.circleyestemperature {
    font-family: weathertext, Arial, system;
    display: table-cell;
    text-align: center;
    height: 2.7rem;
    color: #aaa;
    background: 0;
    position: absolute;
    vertical-align: middle
}

.circleindoortemperature {
    background: 0
}

.circleyestemperature {
    line-height: 44px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin-top: 25px;
    margin-left: 0;
    font-size: .6em;
    border: 1px solid rgba(95, 96, 97, .9)
}

.circlewflightningtoday,
.circlewftodayemperature {
    line-height: 42px
}

.circlewftodayemperature {
    -webkit-border-radius: 50%;
    border-radius: 50%;
    margin-top: 20px;
    margin-left: 0;
    font-size: .55em;
    border: 1px solid rgba(95, 96, 97, .9)
}

.wftemp {
    font-size: 9px;
    top: -12px;
    left: 12px
}

.lightningstrikes {
    margin-left: 9px;
    position: absolute;
    margin-top: 50px;
    width: 15px;
    font-size: .3em
}

.yesterdaytempword {
    margin-left: 12px;
    position: absolute;
    margin-top: 54px;
    width: 15px;
    font-size: .32em
}

.circlewflightningtoday {
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    width: 2.7rem;
    margin-top: 21px;
    margin-left: 0;
    font-size: .6em;
    border: 1px solid rgba(95, 96, 97, .9)
}

.wfstrikes {
    font-size: 9px;
    top: -12px;
    left: 12px
}

.weather34i-cloud-bar {
    background: 0;
    position: absolute;
    height: 100px;
    width: 100px;
    margin-left: 105px;
    margin-top: 38px
}

.weather34i-cloud-bar .bar {
    shape-rendering: crispEdges;
    background: url(rain/cloudmarker.svg) no-repeat;
    width: 100px;
    border: 5px solid rgba(57, 61, 64, 1);
    border-bottom: 3px solid rgba(57, 61, 64, 1);
    border-top: 1px dotted rgba(57, 61, 64, 1);
    -webkit-border-radius: 1px 1px 3px 3px;
    -moz-border-radius: 1px 1px 3px 3px;
    -o-border-radius: 1px 1px 3px 3px;
    -ms-border-radius: 1px 1px 3px 3px;
    border-radius: 1px 1px 3px 3px;
    position: absolute;
    bottom: 0
}

.weather34i-cloud-bar .bar-1 {
    height: 100px;
    max-height: 100px
}

.weather34i-cloud-bar .bar-inner {
    shape-rendering: crispEdges;
    background: rgba(159, 163, 166, .2);
    width: 100%;
    -webkit-border-radius: 1px 1px 3px 3px;
    -moz-border-radius: 1px 1px 3px 3px;
    -o-border-radius: 1px 1px 3px 3px;
    -ms-border-radius: 1px 1px 3px 3px;
    border-radius: 1px 1px 3px 3px;
    border: 0;
    border-top: 1px dotted rgba(255, 124, 57, 1)
}

.weather34icloud,
aqiimageg {
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%
}

.weather34icloud {
    color: rgba(255, 124, 57, 1);
    position: absolute;
    margin-left: 135px;
    margin-top: 57px;
    font-family: weathertext, arial, system;
    max-height: 41px;
    font-weight: 400;
    background: rgba(37, 41, 45, .7);
    width: 41px;
    height: 41px;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 15px;
    line-height: 10px;
    padding-top: 13px;
    border: .12rem solid rgba(95, 96, 97, .9)
}

.weather34icloud span {
    color: #777;
    font-family: arial, system;
    font-size: 8px;
    font-weight: 400
}

.circlepurple,
lorange,
tempblue,
tempgreen,
temporange,
tempred {
    font-weight: 600
}

.extraqiinfo,
.extraqiinfo2 {
    position: relative;
    top: 110px;
    font-size: .8em;
    color: #aaa;
    left: -35px
}

.airqualitymoduleposition {
    position: relative;
    left: 75px;
    top: 10px
}

.daylightmoduleposition {
    position: relative;
    left: 0;
    margin-top: 1px
}

.moonphasemoduleposition {
    position: relative;
    left: 95px;
    margin-top: 10px
}

highestrecorded {
    margin-top: -25px;
    display: block;
    color: #aaa;
    margin-left: 10px
}

dusk {
    font-family: Helvetica, Arial;
    color: #gray;
    font-size: 16px;
    line-height: 30px;
    position: absolute;
    width: 70px;
    margin-left: -14px;
    top: 3px
}

.moonposition1 {
    position: absolute;
    padding-top: 0;
    margin-top: -3px;
    margin-left: -3px;
    font-size: 11px
}

.wu3dayforecast {
    background: 0;
    margin: -14px auto 0 5px
}

.darkskyforecasthome {
    position: absolute;
    width: 300px;
    background: 0;
    /*margin: 30px auto 0 65px;*/
    font-size: 12px;
    color: #aaa;
    font-family: Arial, system;
    display: block;
    border-radius: 4px;
    overflow: hidden
}

.darkskydiv,
.darkskyforecastinghome {
    font-family: Arial, system;
    overflow: hidden!important
}

.darkskydiv {
    width: 300px;
    height: 180px;
    margin-top: 10px
}

.darkskyforecastinghome {
    float: left;
    display: inline;
    width: 29.3%;
    border-radius: 4px;
    margin: 0 0 100px 4%;
    height: 140px;
    padding: 0;
    background-color: none;
    border: 1px solid rgba(153, 155, 156, .1);
    color: #aaa
}

.darkskyweekdayhome {
    position: absolutue;
    text-align: center;
    padding: 2px;
    color: #aaa;
    font-family: Arial, Helvetica;
    font-size: 12px;
    margin: 0;
    background: rgba(37, 41, 45, .2)
}

.darkskyforecasthome darkskytemphihome {
    margin-top: 0;
    font-size: 12px;
    color: #ff8841;
    font-family: Arial, Helvetica;
    margin-left: 1%
}

.darkskyforecasthome darkskytemphihome span {
    font-size: 12px;
    color: #ff8841
}

.darkskyforecasthome darkskytemplohome {
    font-size: 12px;
    color: #01a4b4;
    font-family: Arial, Helvetica
}

.darkskyforecasthome darkskytemplohome span {
    font-size: 12px;
    color: #01a4b4f;
    font-family: Arial, Helvetica
}

.darkskyforecasthome darkskytempwindhome,
.darkskyforecasthome darkskytempwindhome span4 {
    color: #aaa;
    font-family: Arial, Helvetica;
    font-size: 12px
}

.darkskyforecasthome darkskytempwindhome span {
    font-size: 12px;
    color: #01a4b4;
    font-family: Arial, Helvetica
}

.darkskyforecasthome darkskytempwindhome span2 {
    font-size: 12px;
    color: rgba(144, 177, 42, 1);
    font-family: Arial, Helvetica
}

.darkskyiconcurrent span1,
.darkskynexthours,
.darkskynexthours span1,
.darkskynexthours span2 {
    font-family: Arial, system;
    color: #aaa
}

.darkskynexthours span1,
.darkskynexthours span2 {
    font-size: 12px
}

.darkskyiconcurrent {
    position: relative;
    margin-top: 20px;
    margin-bottom: -10px;
    margin-left: 35px;
    float: left
}

.darkskyiconcurrent span1 {
    font-size: .9em
}

heatindex {
    color: #aaa;
    margin-top: -25px;
    display: block;
    font-size: 12px
}

.orangealerticonheatindex {
    margin-top: -35px;
    margin-left: 120px;
    padding: 4px;
    line-height: 20px;
    position: relative
}

.averagetemp,
.avgtemptime,
.avgtep,
.calendar34,
.darkskysummary,
.hometemperatureindoortrend1,
.indoortep,
.indoortrendhouse,
.weatherclock34 {
    position: absolute
}

.weatherclock34 {
    margin: 20px auto 0;
    left: 20px;
    font-size: .6em;
    color: #aaa;
    font-family: weathertext, helvetica, arial;
    text-align: center;
    width: 200px;
    padding: 5px;
    line-height: 18px
}

.calendar34 {
    left: 10px;
    top: 20px;
    color: rgba(230, 232, 239, .2)
}

.darkskysummary {
    font-family: Arial;
    font-size: 12px;
    line-height: 12px;
    height: 35px;
    padding: 5px;
    margin-top: 20px;
    margin-left: 125px;
    max-width: 120px;
    color: #aaa
}

.darkskynexthours {
    font-size: .8em;
    position: relative;
    text-align: center;
    margin: 85px auto auto;
    width: 240px;
    line-height: 11px
}

.averagetemp {
    font-size: .6em;
    color: #aaa;
    display: block;
    top: 8px;
    width: 30px;
    left: 6px
}

.circleavgtemperature,
.circleindoortemperature {
    line-height: 44px;
    vertical-align: middle;
    width: 2.7rem;
    font-family: weathertext, Arial, system;
    height: 2.7rem;
    position: absolute;
    text-align: center;
    color: #aaa
}

.avgtep {
    color: #aaa;
    margin-top: 12px;
    margin-left: 15px;
    font-size: .65em
}

.circleavgtemperature {
    display: table-cell;
    border-radius: 50%;
    margin-top: 8px;
    margin-left: 5px;
    font-size: 1.1em;
    border: 1px solid #444
}

.circlegreen,
.circleindoortemperature {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%
}

.avgtemptime {
    margin-left: 18px;
    margin-top: 35px;
    display: block
}

.indoortep {
    color: #aaa;
    margin-top: 102px;
    margin-left: 15px;
    font-size: .7em
}

indoorblue,
tempblue {
    color: #01a4b4
}

indoororange,
temporange {
    color: #ff8841
}

indoorgreen,
tempgreen {
    color: #9aba2f
}

.circleindoortemperature {
    display: table-cell;
    -ms-border-radius: 50%;
    border-radius: 50%;
    margin-top: 98px;
    margin-left: 5px;
    font-size: 1.1em;
    border: 1px solid #444
}

.maxcircleblue,
.maxcirclegreen {
    display: flex;
    align-items: center
}

indoorblue,
indoorgreen,
indoororange,
indoorred,
indooryellow {
    font-family: weathertext, helvetica, arial
}

.rainratesmall,
.small {
    font-family: Arial, system
}

.hometemperatureindoortrend1 {
    margin-left: 18px;
    margin-top: 125px;
    width: 15px
}

indoorred {
    color: rgba(211, 93, 78, 1)
}

indooryellow {
    color: rgba(233, 171, 74, 1)
}

.indoortrendhouse {
    margin-top: 40px;
    margin-left: 120px;
    font-size: 14px
}

.indoorhomesvg {
    margin-top: -28px;
    left: 8px
}

.indoorhomevalue {
    position: relative;
    margin-top: -90px;
    left: 4px;
    font-size: 26px
}

.indoorhomehumidity {
    position: absolute;
    margin-top: -115px;
    margin-left: 20px
}

.indoorhomefeels {
    position: absolute;
    margin-top: -35px;
    margin-left: 230px
}

homeindoordescription {
    position: absolute;
    font-size: 14px;
    left: 106px;
    line-height: 48px;
    text-align: center;
    color: #aaa
}

homeindoordescription span {
    font-size: 14px
}

.alertcircle,
.alertcircle3 {
    margin-top: 12px
}

.lightningalerticon,
.rainalerticon {
    margin-top: -55px;
    padding: 4px;
    line-height: 20px;
    position: relative
}

.airhouse,
.airsvg,
.indoorhomemax,
.indoorhomemin,
.svgfeels,
airdescription {
    position: absolute
}

.homeweatheralert {
    top: 40px
}

.rainalerticon {
    margin-left: 150px
}

suplight {
    color: #aaa;
    left: 5px;
    font-size: .7em
}

.lightningalerticon {
    margin-left: 165px
}

img {
    image-rendering: pixelated
}

tempred {
    color: #ee7159
}

.svgfeels {
    margin-left: 105px;
    margin-top: -3px
}

.indoorhomemax {
    margin-top: -115px;
    margin-left: 230px
}

.indoorhomemin {
    margin-top: -32px;
    margin-left: 20px
}

.airhouse {
    margin-top: -10px;
    margin-left: 7px;
    background: 0
}

.airsvg {
    margin-top: -12px;
    left: 20px
}

.dottedcirclegreen,
.dottedcircleorange,
.dottedcirclepurple,
.dottedcirclered,
.dottedcircleyellow {
    width: 100px;
    height: 100px;
    margin-top: 25px;
    z-index: 20;
    position: absolute;
    border: 0;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%
}

indoorpurple {
    color: #a475cb
}

.circlegreen,
.circleorange,
.circlepurple,
.circlered,
.circleyellow {
    width: 40px;
    height: 39px;
    line-height: 29px;
    font-weight: 600;
    color: #fff
}

.small,
.smallf {
    top: 10px;
    line-height: 10px;
    color: #fff;
    position: absolute
}

.maxcircleblue,
.maxcirclegreen,
.maxcircleorange,
.maxcircleyellow {
    width: 46px;
    overflow: hidden
}

.airwarning {
    position: absolute;
    margin-left: 150px;
    margin-top: 45px
}

.airwarning1,
.circlegreen,
.circleorange,
.circlepurple,
.circlered,
.circleyellow {
    margin-top: 0;
    position: absolute
}

.airwarning1 {
    margin-left: -60px
}

.airwarning2,
.airwarning21 {
    position: absolute
}

.circlegreen,
.circleyellow {
    font-size: 12px
}

.circlegreen {
    padding-top: 5px;
    background: #9aba2f;
    border-radius: 50%
}

.circleorange,
.circleyellow {
    padding-top: 5px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    font-size: 12px
}

.circleyellow {
    background: rgba(233, 171, 74, 1);
    border-radius: 50%
}

.circleorange {
    background: #ff8841;
    border-radius: 50%
}

.circlepurple,
.circlered {
    padding-top: 5px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    font-size: 12px
}

.circlered {
    background: rgba(211, 93, 78, 1)
}

.circlepurple {
    background: #a475cb
}

.small {
    font-size: 9px;
    font-weight: 400
}

.smallf {
    font-size: .5em;
    font-weight: 400
}

.maxcircleblue,
.maxcirclegreen,
.maxcircleorange,
.maxcirclered,
.maxcircleyellow {
    font-weight: 400;
    height: 46px;
    border-radius: 50%;
    color: #fff;
    line-height: 24px;
    padding-top: 8px;
    font-family: weathertext, system;
    border: 2px solid rgba(59, 61, 63, 1)
}

.maxcircleblue {
    justify-content: center;
    background: #01a4b4
}

.maxcirclegreen {
    justify-content: center;
    background: #9aba2f
}

.maxcircleorange,
.maxcircleyellow {
    align-items: center;
    display: flex
}

.maxcircleyellow {
    justify-content: center;
    background: rgba(233, 171, 74, 1)
}

.maxcircleorange {
    justify-content: center;
    background-color: #ff5722
}

.maxcirclered,
uv0,
uv10,
uv3,
uv5,
uv8 {
    align-items: center;
    width: 46px;
    overflow: hidden
}

.maxcirclered {
    display: flex;
    justify-content: center;
    background-color: #ef5350
}

.airwarning2 {
    margin-top: 15px;
    margin-left: 15px
}

.airwarning21 {
    margin-top: 100px;
    font-size: 14px;
    margin-left: 15px
}

.airwarning3,
.airwarning4 {
    position: absolute;
    margin-left: 0
}

.airwarning3 {
    margin-top: 65px
}

.w34uptime {
    float: right;
    margin-right: 125px;
    margin-top: -30px;
    color: #bbb;
    font-size: 12px;
    background: rgba(86, 95, 103, .4);
    padding: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

uviforecasthourred {
    background: rgba(211, 93, 78, 1)
}

uviforecasthourorange {
    background: #ff8841
}

uviforecasthourgreen {
    background: #9aba2f
}

uv3,
uviforecasthouryellow {
    background: rgba(233, 171, 74, 1)
}

.airwarning4 {
    margin-top: 95px
}

.airwarning4 spani {
    font-size: 11px;
    line-height: 15px
}

.airwarning2 span,
.airwarning21 span {
    line-height: 14px;
    font-weight: 400;
    font-size: 8px
}

.airwarning4 span {
    font-size: 8px;
    line-height: 12px
}

uviforecasthourgreen,
uviforecasthourorange,
uviforecasthourred,
uviforecasthouryellow {
    border-radius: 4px;
    padding: 0 3px;
    font-size: 14px;
    font-family: weathertext, system;
    color: #fff
}

spanewind,
spanewind2,
windyeartimemax,
windyesterdaytimemax {
    color: #aaa;
    font-size: 11px;
    position: absolute
}

spanewind,
spanewind2 {
    font-family: Arial, system;
    top: -10px;
    width: 30px
}

spanewind {
    left: 45px
}

spanewind2 {
    left: 42px
}

windyesterdaytimemax {
    top: 15px;
    left: 5px
}

windyeartimemax {
    top: 15px;
    left: -75px;
    width: 200px
}

.azimuth,
.dewindooricon,
.elevation,
.homeindoorfeels1,
.indoordewpoint,
.indoorhomeheat,
.lightningstrikes1,
.wfstrikes1,
.wftemp1,
.yesterdaytempword1,
svgdewindoor,
talert {
    position: absolute
}

.indoorhomeheat {
    margin-top: 43px;
    margin-left: 123px;
    padding: 5px;
    line-height: 10px;
    color: #f2f2f2;
    z-index: 10;
    font-size: 13px
}

.indoordewpoint {
    color: #aaa;
    margin-top: 15px;
    margin-left: 110px;
    font-size: .9em
}

.indoordewpoint span {
    font-size: 1.1em
}

svgdewindoor {
    margin-left: 5px;
    margin-top: 0
}

.dewindooricon {
    margin-left: 92px;
    margin-top: 15px
}

darkgrey {
    color: #aaa
}

.circlewflightningtoday1,
.maxcirclerain,
uv0,
uv10,
uv3,
uv5,
uv8 {
    font-family: weathertext, system
}

.orangealerticon1 {
    top: -10px
}

.circlewflightningtoday1 {
    height: 80px;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    color: #aaa;
    position: absolute;
    line-height: 80px;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 80px;
    margin-top: 28px;
    margin-left: 25px;
    font-size: 2.1em;
    border: 3px solid #ff8841;
    font-weight: 200
}

.wftemp1 {
    font-size: 14px;
    top: -25px;
    left: 22px;
    color: #aaa
}

.lightningstrikes1 {
    margin-left: 48px;
    margin-top: 85px;
    width: 15px;
    font-size: .8em
}

.yesterdaytempword1 {
    margin-left: 12px;
    margin-top: 52px;
    width: 15px;
    font-size: .32em
}

.wfstrikes1 {
    font-size: 9px;
    top: -12px;
    left: 12px;
    color: #aaa
}

.homeindoorfeels1 {
    margin-left: 125px;
    margin-top: 20px;
    border-radius: 3px;
    padding: 5px;
    text-align: left;
    border: 1px solid rgba(95, 96, 97, .4);
    width: 170px;
    font-size: 14px;
    color: #aaa
}

.lightningbox {
    padding: 10px;
    border-radius: 4px;
    border: 1px solid solid
}

lightningannualx,
lightningannualx1 {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    color: #aaa
}

lorange {
    color: #ff8841;
    font-weight: 400
}

lorange1 {
    color: #ff8841;
    font-weight: 100
}

timeago {
    display: block;
    font-size: 12px;
    color: #aaa
}

agolightning {
    color: #ff8841;
    font-size: 13px
}

uv0,
uv10,
uv3,
uv5,
uv8 {
    display: flex;
    justify-content: center;
    height: 45px;
    border-radius: 50%;
    color: #fff;
    line-height: 10px;
    padding-top: 0;
    font-size: 18px;
    border: 1px solid rgba(53, 56, 58, 1);
    font-weight: 400
}

.orangeclock,
notifyblue {
    -webkit-border-radius: 3px
}

uv5 {
    background-color: #f5650a
}

uv8 {
    background-color: #ef5350
}

uv10 {
    background-color: #a475cb
}

talert {
    top: 15px;
    margin-left: 40px;
    font-size: 14px;
    line-height: 16px
}

.orangealerticon1 {
    margin-top: -17px;
    margin-left: 160px;
    background: 0;
    padding: 4px;
    line-height: 10px;
    position: relative
}

.weather34iuvrate {
    position: absolute;
    margin-left: 125px;
    margin-top: 70px
}

.uvspan {
    position: absolute;
    font-size: 10px;
    line-height: 0;
    font-weight: strong;
    margin-top: 145px;
    margin-left: 115px;
    color: #aaa
}

.weather34luxrate {
    color: #f5650a;
    margin-left: 250px;
    margin-top: 27px;
    font-size: 12px;
    width: 28px;
    max-height: 100px;
    line-height: 10px;
    font-weight: 400;
    text-align: center
}

.barrainrate,
.luxrate {
    font-weight: 400;
    text-align: left
}

.weather34luxrate span {
    color: rgba(2, 29, 62, .8);
    font-size: 12px;
    font-weight: 400;
    display: block
}

luxrate,
luxratei {
    color: #ff8841;
    padding: 0;
    margin-top: 0;
    text-align: left;
    display: inline-block;
    position: absolute
}

luxrate {
    left: -5px
}

luxratei {
    left: -10px
}

luxrate span {
    color: #777;
    font-size: 10px;
    left: 5px
}

.luxrate {
    color: #f5650a;
    font-size: 12px;
    padding-left: 0
}

.luxrate span {
    color: #777;
    font-size: 12px;
    left: 4px;
    margin-top: 1px
}

.weather34uvpyramid {
    position: absolute;
    margin-top: 15px;
    margin-left: 84px;
    color: rgba(75, 75, 77, .7)
}

spanefreezing {
    position: absolute;
    font-size: 12px;
    color: #4cb1bd;
    font-family: Arial, system;
    top: -3px;
    width: 200px;
    left: 20px;
    font-weight: 400
}

.orangeclock {
    position: relative;
    background: rgba(205, 82, 69, .8);
    padding: 1px;
    color: #fff;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    width: 100px;
    height: 19px;
    text-align: center;
    margin-left: 45px;
    margin-top: 3px;
    font-family: "Courier New", Courier, monospace
}

.maxcirclerain,
.rainratesmall {
    position: absolute;
    font-weight: 400
}

.maxcirclehum,
.maxcirclerain {
    display: flex;
    align-items: center;
    overflow: hidden;
    background: rgba(42, 43, 48, .8)
}

darkgray {
    color: #aaa
}

.maxcirclerain {
    justify-content: center;
    height: 36px;
    width: 38px;
    border: 1px solid rgba(230, 232, 239, .1);
    border-radius: 50%;
    color: #01a4b4;
    line-height: 26px;
    padding-top: 7px;
    left: 12.7px;
    top: 55px
}

.rainratesmall {
    top: 3px;
    color: #777;
    font-size: 9px;
    line-height: 12px;
    left: 9px
}

.weather34feelsrate,
.weather34indoorhumrate {
    position: absolute;
    margin-top: -5px;
    font-size: 12px;
    max-height: 100px
}

.weather34feelsrate,
.weather34feelsrate span,
.weather34indoorhumrate,
.weather34indoorhumrate span {
    font-family: arial, system;
    color: #bbb
}

nosun {
    position: absolute;
    left: -5px;
    top: 25px
}

.weather34indoorhumrate {
    margin-left: 24px
}

.weather34feelsrate {
    margin-left: 239px
}

.maxcirclehum {
    justify-content: center;
    height: 34px;
    width: 37px;
    font-weight: 400;
    border: 1px solid rgba(230, 232, 239, .2);
    border-radius: 50%;
    color: #bbb;
    line-height: 28px;
    padding-top: 8px;
    font-family: Arial, system;
    position: absolute;
    left: 1px;
    top: 60px
}

.weather34feelsword,
.weather34humidityword {
    color: #999;
    font-size: 10px;
    font-family: arial, system;
    position: absolute
}

.thearrow4:after,
.thearrow7:after {
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 0
}

.thearrow3:after,
.thearrow4:after,
.thearrow7:after,
.weather34barometerarrowactual:after,
.weather34barometerarrowmin:after {
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%)
}

.weather34humidityword {
    margin-left: 28px;
    margin-top: 17px
}

.weather34feelsword {
    margin-left: 235px;
    margin-top: 17px
}

.thearrow7:after {
    top: 0;
    border-radius: 0;
    border-bottom: 5px solid rgba(255, 124, 57, .7)
}

.thearrow4:after {
    top: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    border-bottom: 5px solid rgba(102, 188, 199, .7)
}

.thearrow4,
.thearrow7 {
    position: absolute;
    top: 0;
    left: 43%;
    margin-left: -6px;
    width: 10px;
    height: 50%;
    -o-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

.thearrow3:after,
.thearrow4:after,
.thearrow7:after {
    background-color: NONE;
    -o-transform: translate(-50%, -50%)
}

.weather34luxvalue {
    position: absolute;
    margin-left: 242px;
    margin-top: 5px;
    font-size: 13px;
    line-height: 10px;
    font-weight: 400;
    text-align: center;
    max-width: 20px;
    z-index: 10
}

.solarsun,
.weather34luxword {
    margin-left: 233px
}

.weather34luxvalue span {
    font-size: 10px;
    font-weight: 400;
    display: block;
    z-index: 10
}

.circlelux,
circlesolar {
    display: flex;
    position: absolute;
    font-family: weathertext, arial, system;
    background: rgba(37, 41, 45, .7);
    width: 2.3rem;
    height: 2.25rem;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    font-size: 13px;
    line-height: 12px;
    padding-top: 5px;
    border: .12rem solid rgba(95, 96, 97, .9);
    left: -4px;
    top: 70px
}

.luxratedark,
.weather34solarvalue {
    line-height: 10px;
    position: absolute
}

.circlelux,
circlesolar span {
    display: block;
    align-items: center;
    font-size: 11px
}

solarluxvalue {
    font-size: 15px
}

.solarsun {
    position: absolute;
    margin-top: 25px;
    color: rgba(255, 124, 57, 1)
}

.weather34luxword,
.weather34solarword {
    margin-top: 35px;
    font-size: .7em;
    color: #bbb;
    position: absolute
}

.weather34solarword {
    margin-left: 12px
}

.weather34solarvalue {
    margin-left: 32px;
    margin-top: 5px;
    font-size: 12px;
    font-weight: 400;
    text-align: center;
    max-width: 20px;
    z-index: 10
}

.weather34solarvalue span {
    font-size: 10px;
    font-weight: 400;
    display: block;
    z-index: 10
}

.luxratedark,
.luxratedark span {
    text-align: center;
    font-size: 11px
}

nosun1 {
    position: absolute;
    left: 0;
    top: 35px;
    z-index: 10
}

.weather34barometerarrowactual,
.weather34barometerarrowmin {
    z-index: 200;
    -o-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%
}

.luxratedark {
    color: #f5650a;
    display: inline-block;
    left: -5px
}

.luxratedark span {
    color: color: rgba(236, 87, 27, 1);
    display: block
}

.weather34-feelslikeindoor,
.weather34-humidityindoor {
    position: absolute;
    height: 100px;
    width: 30px;
    margin-top: 20px;
    color: rgba(57, 61, 64, 1)
}

.weather34-feelslikeindoor {
    margin-left: 232px
}

.weather34-humidityindoor {
    margin-left: 17px
}

.weather34uvposition {
    position: relative;
    margin-top: -5px
}

.weather34barometerarrowactual {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: 0;
    width: 8px;
    height: 50%;
    -webkit-transform-origin: 50% 100%;
    -moz-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

.weather34barometerarrowactual:after {
    background-color: NONE;
    -o-transform: translate(-50%, -50%);
    position: absolute;
    left: 50%;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 5px 0;
    border-color: rgba(255, 124, 57, 1) transparent transparent;
    transform: translate(-50%, -50%)
}

.weather34barometerarrowactual:before {
    content: 'o o o';
    width: 0;
    position: absolute;
    left: 2px;
    top: -5px;
    border: 0;
    color: rgba(255, 124, 57, 1);
    font-size: 5px;
    font-family: Arial, system
}

.weather34barometerarrowmax:after,
.weather34barometerarrowmax:before,
.weather34barometerarrowmin:after,
.weather34barometerarrowmin:before {
    content: '';
    position: absolute
}

.weather34barometerarrowmin {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: 0;
    width: 8px;
    height: 50%;
    -webkit-transform-origin: 50% 100%;
    -moz-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

.weather34barometerarrowmin:after {
    background-color: NONE;
    -o-transform: translate(-50%, -50%);
    left: 50%;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3px;
    border-color: rgba(102, 188, 199, .8);
    -webkit-border-radius: 50%;
    border-radius: 50%;
    transform: translate(-50%, -50%)
}

.weather34barometerarrowmin:before {
    width: 0;
    left: 2px;
    top: -5px;
    border: 0;
    color: rgba(102, 188, 199, .6);
    font-size: 5px;
    font-family: Arial, system
}

.weather34barometerarrowmax {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: 0;
    width: 8px;
    height: 50%;
    -webkit-transform-origin: 50% 100%;
    -moz-transform-origin: 50% 100%;
    -o-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

.weather34barometerarrowmax:after {
    -webkit-transform: translate(-50%, -50%);
    background-color: NONE;
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    left: 50%;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3px;
    border-color: rgba(255, 121, 58, .8);
    -webkit-border-radius: 50%;
    border-radius: 50%;
    transform: translate(-50%, -50%)
}

#weather34sunclock2,
.weather34sunclock {
    -webkit-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%
}

.weather34barometerarrowmax:before {
    width: 0;
    left: 2px;
    top: -5px;
    border: 0;
    color: rgba(255, 121, 58, .6);
    font-size: 5px;
    font-family: Arial, system
}

.daylightvalue1:before,
.daylightvalue34:before {
    content: "Estimated";
    letter-spacing: normal
}

.weather34-barometerruler {
    position: absolute;
    width: 135px;
    height: 1px;
    border: 1px dashed rgba(53, 56, 58, 1);
    background: 0;
    margin-left: 65px;
    margin-top: 62px
}

weather34-barometerlimitmax,
weather34-barometerlimitmin,
weather34-barometerlimitminf {
    margin-top: -6px;
    position: absolute;
    font-size: 11px
}

weather34-barometerlimitmin {
    left: -27px;
    color: rgba(77, 175, 189, 1)
}

weather34-barometerlimitmax {
    left: 140px;
    color: rgba(255, 124, 57, 1)
}

weather34-barometerlimitminf {
    left: -20px;
    color: rgba(77, 175, 189, 1)
}

weather34-barometerlimitmaxf {
    position: absolute;
    margin-top: 0;
    left: 163px;
    font-size: 11px;
    color: rgba(255, 124, 57, 1)
}

.solaricon,
.solaricon1 {
    position: absolute;
    margin-top: 20px
}

.solaricon {
    margin-left: 35px
}

.solaricon1 {
    margin-left: 250px
}

.homeweatherstationlogo {
    margin-top: -7px;
    margin-left: 25px
}

#weather34lightningdialog-notify {
    width: 200px;
    max-height: 250px;
    right: 10px;
    top: 10px;
    z-index: 9999;
    position: fixed;
    font-family: Arial, system;
    -webkit-animation-duration: 10s;
    animation-duration: 10s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 2
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 2
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.weather34lightningdialog-box {
    position: relative;
    min-height: 80px;
    max-height: 180px;
    border-radius: 10px;
    margin-bottom: 8px;
    overflow: hidden;
    background: rgba(97, 106, 114, 1)
}

.weather34lightningdialog-box .header {
    height: 30px;
    position: relative;
    color: #aaa;
    background: rgba(97, 106, 114, 1);
    line-height: 22px;
    font-family: Arial, system
}

.weather34lightningbackground-alert {
    height: 100%;
    width: 100%;
    background-color: rgba(61, 64, 66, 1);
    position: absolute
}

.left,
.right {
    width: content-max
}

.left {
    float: left;
    text-align: left;
    padding: 3px 0 0 10px
}

.right {
    float: right;
    text-align: right;
    padding: 3px 10px 0 0
}

.weather34lightningcontents {
    z-index: 100;
    position: inherit;
    font-size: 14px;
    text-align: center
}

.weather34lightningmain-content {
    padding: 8px 20px 10px 10px;
    height: content-max;
    background: rgba(97, 106, 114, 1);
    color: #fff;
    line-height: 16px;
    text-align: center;
    font-family: Arial, system;
    font-size: .9remem
}

period {
    color: #aaa
}

.daylightvalue1 {
    position: absolute;
    margin-left: 85px;
    top: 45px
}

.daylightvalue1 hours {
    position: relative;
    left: -5px
}

.daylightvalue1 period {
    position: absolute;
    font-size: 11px;
    line-height: 1em;
    top: 20px;
    left: 44px;
    letter-spacing: normal;
    color: #ff7c39
}

.daylightvalue1 hrs {
    margin-left: 0
}

.daylightvalue1 span {
    position: relative;
    left: 42px;
    top: -3px;
    color: #ff7c39;
    font-size: 26px;
    margin-right: 7px
}

.azimuth,
.elevation {
    position: absolute;
    margin-top: -20px;
    font-size: 11px;
    width: 50px;
    font-family: Arial, system;
    line-height: 12px;
    font-weight: 400;
    color: #bbb
}

.daylightvalue1:before {
    position: absolute;
    display: block;
    font-size: 11px;
    line-height: 20px;
    top: -28px;
    left: 45px;
    border: 0;
    color: #aaa
}

notifyblue,
notifyorange {
    color: #fff;
    padding: 0 2px;
    font-family: Arial, system;
    font-weight: 600
}

.azimuth {
    left: -60px
}

.elevation {
    left: 160px
}

.sundialcontainerdiv {
    position: relative;
    top: 10px;
    margin-left: -5px
}

notifyblue {
    background: #44a6b5;
    border-radius: 3px
}

notifyorange {
    background: #ff7c39;
    -webkit-border-radius: 3px;
    border-radius: 3px
}

body {
    font-smoothing: antialiased;
    color-adjust: [exact]
}

.vp2container {
    display: flex;
    justify-content: center;
    align-items: center
}

.consoleoutlook {
    position: relative;
    color: #bbb;
    font-size: .42em;
    font-family: Arial, system;
    font-weight: 400;
    margin-top: 1.5rem;
    line-height: 1em;
    margin-left: 20px;
    width: 170px
}

.weather34sunclock {
    width: 120px;
    height: 120px;
    background: 0;
    margin-left: 95px;
    margin-top: 15px;
    border-radius: 100%;
    position: absolute;
    border: 4px solid rgba(59, 60, 63, 1);
    -moz-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

#mooncircleinner,
#weather34sunclock2 {
    background: 0;
    margin-left: 1px;
    position: absolute
}

.weather34sunclock div {
    position: absolute;
    -webkit-transform-origin: 49.6% 49.5%;
    -moz-transform-origin: 49.6% 49.5%;
    -o-transform-origin: 49.6% 49.5%;
    -ms-transform-origin: 49.6% 49.5%;
    transform-origin: 49.6% 49.5%;
    transform: rotate(0)
}

#weather34sunclock2 {
    width: 110px;
    height: 110px;
    margin-top: 1px;
    border-radius: 100%;
    border: 2px solid rgba(86, 95, 103, 1);
    -moz-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

.consoleicon {
    position: absolute;
    left: 170px;
    top: 32px;
    width: 28px;
    height: 28px
}

.sun-south {
    left: 145px;
    top: 5px
}

.sun-north {
    left: 146px;
    top: 135px
}

.sun-east {
    left: 87px;
    top: 70px
}

.sun-west {
    left: 218px;
    top: 70px
}

.sun-east,
.sun-north,
.sun-south,
.sun-west {
    font-size: 8px;
    position: absolute;
    color: #bbb
}

#mooncircleinner {
    width: 110px;
    height: 110px;
    top: 1px;
    border-radius: 50%;
    border: 2px solid rgba(86, 95, 103, 1);
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

.daylightvalue34,
.daylightvalue34 minutes {
    font-family: weathertext, Helvetica, Arial;
    font-size: 26px;
    line-height: 20px;
    width: 100px;
    border: 0;
    position: absolute;
    color: #f8f8f8
}

.daylightvalue34 {
    left: 17px;
    margin-top: 20px
}

.daylightvalue34 minutes {
    left: 40px
}

.daylightvalue34 period,
.daylightvalue34:before {
    font-family: Helvetica, Arial
}

.daylightvalue34 dayperiod {
    color: #f8f8f8;
    border: 0;
    position: absolute;
    font-size: 10px;
    left: 15px;
    top: 20px;
    width: 100px
}

.daylightvalue34 hrs,
.daylightvalue34 min {
    font-size: 9px;
    top: -17px;
    color: #f8f8f8;
    letter-spacing: normal;
    position: absolute
}

.daylightvalue34 min {
    left: 85px
}

.daylightvalue34 hrs {
    left: 40px
}

.daylightvalue34 {
    position: absolute;
    margin-left: 68px;
    top: 50px
}

.daylightvalue34 hours {
    position: relative;
    left: -5px
}

.daylightvalue34 period {
    position: absolute;
    font-size: 11px;
    line-height: 20px;
    top: 20px;
    left: 44px;
    letter-spacing: normal;
    color: #f8f8f8
}

.daylightvalue34 hrs {
    margin-left: 0
}

.daylightvalue34 span {
    border: 0;
    position: relative;
    left: 42px;
    top: -3px;
    color: #f8f8f8;
    font-size: 26px;
    margin-right: 7px
}

.daylightvalue34:before {
    position: absolute;
    display: block;
    font-size: 11px;
    line-height: 20px;
    top: -28px;
    left: 45px;
    border: 0;
    color: #f8f8f8
}

.daylightoutput {
    border: 4px solid rgba(86, 95, 103, 1)
}

.weather34box .value1 {
    position: absolute;
    font-size: 14px;
    font-weight: lighter;
    padding: 0 3px;
    color: #aaa;
    float: left;
    top: 30px;
    display: block;
    text-align: left
}

.barometerconvertercircleblue,
.rainconvertercircle {
    height: 1.3rem;
    font-weight: 400;
    overflow: hidden;
    line-height: 16px
}

.rainconverter {
    position: absolute;
    margin-left: 260px;
    margin-top: 5px;
    font-size: 12px
}

.rainconvertercircle {
    background: rgba(59, 156, 172, .9);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    border: 2px solid rgba(56, 56, 60, 1);
    border-radius: 4px;
    color: #fff;
    font-family: weathertext, Arial, system;
    font-size: 1em
}

smallrainunit {
    font-size: .7em
}

.tempconverter,
.tempconverter2 {
    position: absolute;
    margin-top: 5px;
    font-size: 12px
}

.tempconverter {
    margin-left: 10px
}

.tempconverter2 {
    margin-left: 260px
}

.tempconvertercircleblue,
.tempconvertercirclegreen,
.tempconvertercircleorange,
.tempconvertercirclepurple,
.tempconvertercirclered,
.tempconvertercircleyellow {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 1.3rem;
    width: 3rem;
    font-weight: 400;
    border: 2px solid rgba(56, 56, 60, 1);
    overflow: hidden;
    border-radius: 4px;
    color: #fff;
    line-height: 16px;
    font-family: weathertext, Arial, system;
    font-size: 1em
}

.barometerconverter,
.barometertrendx,
.tempindoorconverter,
.tempindoorextra {
    font-size: 12px;
    position: absolute
}

.tempconvertercirclegreen {
    background: rgba(144, 177, 42, .8)
}

.tempconvertercircleyellow {
    background: rgba(230, 161, 65, .8)
}

.tempconvertercirclepurple {
    background: #a475cb
}

.tempconvertercircleorange {
    background: rgba(255, 124, 57, .8)
}

.tempconvertercirclered {
    background: rgba(211, 93, 78, .8)
}

.tempconvertercircleblue {
    background: rgba(59, 156, 172, 1)
}

.tempindoorextra {
    margin-left: 235px;
    margin-top: 130px
}

.tempindoorconverter {
    margin-left: 260px;
    margin-top: -15px
}

.barometerconverter {
    margin-left: 252px;
    margin-top: 5px
}

.barometertrendx {
    margin-left: 10px;
    margin-top: 135px
}

smallsup {
    color: #aaa;
    font-size: .5rem;
    font-family: Arial, Helvetica, sans-serif
}

.tempconverter1 {
    position: absolute;
    margin-left: 55px;
    margin-top: 0;
    font-size: 12px
}

.tempconvertercircleblue1,
.tempconvertercirclegreen1,
.tempconvertercircleorange1,
.tempconvertercirclered1,
.tempconvertercircleyellow1 {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 1.3rem;
    width: 3.2rem;
    border: 2px solid rgba(56, 56, 60, 1);
    overflow: hidden;
    border-radius: 4px;
    line-height: 16px;
    font-family: weathertext, Arial, system;
    font-size: 1em;
    color: #fff
}

.tempconvertercircleyellow1 {
    background: rgba(230, 161, 65, 1)
}

.tempconvertercircleorange1 {
    background: rgba(255, 124, 57, 1)
}

.tempconvertercircleblue1 {
    background: rgba(59, 156, 172, 1)
}

.tempconvertercirclegreen1 {
    background: rgba(144, 177, 42, 1)
}

.heatcircle {
    float: left;
    margin-top: 40px;
    margin-left: 100px;
    padding: 0;
    width: 170px;
    position: absolute
}

.heatcircle2 {
    float: left;
    margin-top: 0;
    margin-left: 70px;
    padding: 0;
    width: 170px;
    position: absolute
}

.heatcircle3,
.heatcircle4 {
    margin-top: 40px;
    padding: 0;
    width: 170px;
    float: left;
    position: absolute
}

.heatcircle3 {
    margin-left: 0
}

.heatcircle4 {
    margin-left: 70px
}

.windconverter {
    position: absolute;
    margin-left: 255px;
    margin-top: -15px;
    font-size: 12px
}

.windconvertercircleblue1,
.windconvertercirclegreen1,
.windconvertercircleorange1,
.windconvertercirclered1,
.windconvertercircleyellow1 {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 1.3rem;
    width: 3.2rem;
    border: 2px solid rgba(56, 56, 60, 1);
    overflow: hidden;
    border-radius: 4px;
    line-height: 16px;
    font-family: weathertext, Arial, system;
    font-size: 1em;
    color: #fff
}

.windconvertercircleyellow1 {
    background: rgba(230, 161, 65, 1)
}

.windconvertercircleorange1 {
    background: rgba(255, 124, 57, 1)
}

.windconvertercirclered1 {
    background: rgba(211, 93, 78, 1)
}

.windconvertercircleblue1 {
    background: rgba(59, 156, 172, 1)
}

.windconvertercirclegreen1 {
    background: rgba(144, 177, 42, 1)
}

.barometerconvertercircleblue {
    background: rgba(59, 156, 172, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    border: 2px solid rgba(56, 56, 60, 1);
    border-radius: 4px;
    color: #fff;
    font-family: weathertext, Arial, system;
    font-size: 1em;
    right: 10px
}

.tempcontainer {
    float: left;
    font-family: weathertext, arial, system;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    bottom: 0;
    right: 0;
    position: absolute;
    position: relative;
    margin: 40px 10px 10px 40px;
    left: -5px;
    top: -5px
}

.tempcontainerx {
    position: relative;
    left: -20px;
    top: -11px
}

.outside0-5,
.outside11-15,
.outside16-20,
.outside21-25,
.outside26-30,
.outside31-35,
.outside36-40,
.outside41-45,
.outside50,
.outside6-10,
.outsideminus,
.outsideminus5,
.outsidezero {
    font-family: weathertext, Arial, Helvetica, system;
    width: 6rem;
    height: 5.5rem;
    font-size: 1.9rem;
    padding-top: 10px;
    color: #f8f8f8;
    border-bottom: 18px solid rgba(56, 56, 60, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.outsideminus,
.outsideminus5,
.outsidezero {
    background: rgba(0, 164, 180, .8);
    background: -webkit-linear-gradient(270deg, #00a4b4, rgba(80, 69, 188, 1));
    background: -o-linear-gradient(270deg, #00a4b4, rgba(80, 69, 188, 1));
    background: -moz-linear-gradient(270deg, #00a4b4, rgba(80, 69, 188, 1));
    background: -ms-linear-gradient(270deg, #00a4b4, rgba(80, 69, 188, 1));
    background: linear-gradient(270deg, #00a4b4, rgba(80, 69, 188, 1))
}

.outside0-5 {
    background: rgba(0, 164, 180, 1);
    background: -webkit-linear-gradient(270deg, #00a4b4, #087883);
    background: -o-linear-gradient(270deg, #00a4b4, #087883);
    background: -moz-linear-gradient(270deg, #00a4b4, #087883);
    background: -ms-linear-gradient(270deg, #00a4b4, #087883);
    background: linear-gradient(270deg, #00a4b4, #087883)
}

.outside6-10 {
    background: #88b04b;
    background: -webkit-linear-gradient(90deg, #00a4b4, #88b04b);
    background: -o-linear-gradient(90deg, #00a4b4, #88b04b);
    background: -moz-linear-gradient(90deg, #00a4b4, #88b04b);
    background: -ms-linear-gradient(90deg, #00a4b4, #88b04b);
    background: linear-gradient(90deg, #00a4b4, #88b04b)
}

.outside11-15 {
    background: rgba(230, 161, 65, 1));
    background: -webkit-linear-gradient(90deg, #9aba2f, rgba(230, 161, 65, 1));
    background: -o-linear-gradient(90deg, #9aba2f, rgba(230, 161, 65, 1));
    background: -moz-linear-gradient(90deg, #9aba2f, rgba(230, 161, 65, 1));
    background: -ms-linear-gradient(90deg, #9aba2f, rgba(230, 161, 65, 1));
    background: linear-gradient(90deg, #9aba2f, rgba(230, 161, 65, 1))
}

.outside16-20 {
    background: rgba(255, 124, 57, 1);
    background: -webkit-linear-gradient(90deg, #9aba2f, rgba(255, 124, 57, 1));
    background: -o-linear-gradient(90deg, #9aba2f, rgba(255, 124, 57, 1));
    background: -moz-linear-gradient(90deg, #9aba2f, rgba(255, 124, 57, 1));
    background: -ms-linear-gradient(90deg, #9aba2f, rgba(230, 161, 65, 1));
    background: linear-gradient(90deg, #9aba2f, rgba(255, 124, 57, 1))
}

.outside21-25 {
    background: #efa80f;
    background: -webkit-linear-gradient(90deg, #efa80f, #d86858);
    background: -o-linear-gradient(90deg, #efa80f, #d86858);
    background: -moz-linear-gradient(90deg, #efa80f, #d86858);
    background: -ms-linear-gradient(90deg, #efa80f, #d86858);
    background: linear-gradient(90deg, #efa80f, #d86858)
}

.outside26-30 {
    background: -webkit-linear-gradient(90deg, #d86858, rgba(236, 102, 21, 1));
    background: -o-linear-gradient(90deg, #d86858, rgba(236, 102, 21, 1));
    background: -moz-linear-gradient(90deg, #d86858, rgba(236, 102, 21, 1));
    background: -ms-linear-gradient(90deg, #d86858, rgba(236, 102, 21, 1));
    background: linear-gradient(90deg, #d86858, rgba(236, 102, 21, 1))
}

.outside31-35,
.tempconvertercirclered1 {
    background: #d86858;
    background: -webkit-linear-gradient(90deg, #d86858, rgba(211, 93, 78, .7));
    background: -o-linear-gradient(90deg, #d86858, rgba(211, 93, 78, .7));
    background: -moz-linear-gradient(90deg, #d86858, rgba(211, 93, 78, .7));
    background: -ms-linear-gradient(90deg, #d86858, rgba(211, 93, 78, .7));
    background: linear-gradient(90deg, #d86858, rgba(211, 93, 78, .7))
}

.outside36-40 {
    background: #fd7641;
    background: -webkit-linear-gradient(90deg, #fd7641, #637ff6);
    background: -o-linear-gradient(90deg, #fd7641, #637ff6);
    background: -moz-linear-gradient(90deg, #fd7641, #637ff6);
    background: -ms-linear-gradient(90deg, #fd7641, #637ff6);
    background: linear-gradient(90deg, #fd7641, #637ff6)
}

.outside41-45,
.outside50 {
    background: #de2c52;
    background: -webkit-linear-gradient(90deg, #de2c52, #637ff6);
    background: -o-linear-gradient(90deg, #de2c52, #637ff6);
    background: -moz-linear-gradient(90deg, #de2c52, #637ff6);
    background: -ms-linear-gradient(90deg, #de2c52, #637ff6);
    background: linear-gradient(90deg, #de2c52, #637ff6)
}

smalltempunit {
    font-size: .5em
}

smalltempunit2 {
    font-size: .55rem
}

smallrainunit2 {
    font-size: .5rem;
    color: #fff
}

.temptrendx {
    position: absolute;
    margin-top: -17px;
    margin-left: 5%;
    text-align: center;
    z-index: auto;
    font-size: 0;
    color: #aaa;
    font-family: Arial, system
}

trendmovementfallingx,
trendmovementrisingx {
    color: #bbb;
    font-size: .7rem;
    font-family: Arial, system
}

trendmovementsteadyx {
    color: #bbb;
    font-size: .7rem
}

.maxdata {
    position: absolute;
    font-family: Arial, Helvetica, system;
    font-size: .75rem;
    color: #f8f8f8;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 5px auto auto;
    left: 18%
}

.indoorhomesvg1 {
    margin-top: -2px;
    left: 20px;
    color: rgba(57, 61, 64, 1);
    margin-left: 8px
}

.indoortrendhouse1 {
    position: absolute;
    margin-left: 143px;
    margin-top: 56px;
    font-size: .55rem;
    z-index: 1;
    color: #fff
}

.indoorhomevalue1 {
    position: relative;
    margin-top: -89px;
    left: 0;
    font-size: 23px;
    padding-right: 4px;
    padding-left: 0
}

indoorblue1,
indoorgreen1,
indoororange1,
indoorred1,
indooryellow1 {
    font-family: weathertext, Arial, Helvetica, system;
    width: 3.3rem;
    height: 2.6rem;
    font-size: .8rem;
    padding-top: 7px;
    color: #fff;
    border-bottom: 10px solid rgba(56, 56, 60, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    position: absolute;
    margin-left: 129px;
    top: -5px
}

.raintoday1,
.uvtoday1,
.uvtoday1-3,
.uvtoday11,
.uvtoday4-5,
.uvtoday6-8,
.uvtoday9-10 {
    padding-top: 7px;
    align-items: center;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px
}

.raincontainer1,
.uvcontainer1 {
    position: relative;
    margin: 40px 10px 10px 40px;
    float: left;
    -o-font-smoothing: antialiasedleft: 0;
    bottom: 0;
    right: 0
}

indoorred1 {
    background: rgba(211, 93, 78, 1)
}

indoororange1 {
    background: #ff8841
}

indoorgreen1 {
    background: #9aba2f
}

indoorblue1 {
    background: #01a4b4
}

indooryellow1 {
    background: rgba(233, 171, 74, 1)
}

.raincontainer1 {
    font-family: weathertext, system;
    left: 95px;
    top: 40px
}

.raintoday1 {
    font-family: weathertext, Arial, Helvetica, system;
    width: 3rem;
    height: 2.5rem;
    font-size: .8rem;
    color: #f8f8f8;
    background: rgba(59, 156, 172, .7);
    border-bottom: 8px solid rgba(56, 56, 60, 1);
    display: flex;
    justify-content: center;
    border-radius: 3px
}

smalluvunit {
    font-size: .55rem;
    font-family: Arial, Helvetica, system;
    font-weight: 600
}

.uvcontainer1 {
    font-family: weathertext, system;
    left: 70px;
    top: 15px
}

.simsek,
.uvtoday1,
.uvtoday1-3,
.uvtoday11,
.uvtoday4-5,
.uvtoday6-8,
.uvtoday9-10,
topblue1,
topgreen1,
toporange1,
topred1,
topyellow1 {
    font-family: weathertext, Arial, Helvetica, system;
    display: flex
}

.uvtoday1,
.uvtoday1-3,
.uvtoday11,
.uvtoday4-5,
.uvtoday6-8,
.uvtoday9-10 {
    width: 5rem;
    height: 4.5rem;
    font-size: 1.55rem;
    color: #fff;
    border-bottom: 15px solid rgba(56, 56, 60, 1);
    justify-content: center;
    border-radius: 3px
}

.uvcaution,
.uvtrend {
    position: absolute;
    font-size: .65rem
}

.uvtoday1-3 {
    background: rgba(144, 177, 42, 1)
}

.simsek,
.uvtoday4-5 {
    background: rgba(230, 161, 65, 1)
}

.uvtoday6-8 {
    background: rgba(255, 124, 57, .8)
}

.uvtoday9-10 {
    background: rgba(211, 93, 78, .8)
}

.uvtoday11 {
    background: rgba(204, 135, 248, .7)
}

.uvcaution {
    margin-left: 120px;
    margin-top: 112px;
    font-family: Arial, Helvetica, system
}

.uvtrend {
    margin-left: 128px;
    margin-top: 58px;
    z-index: 1;
    color: #fff
}

.simsekcontainer {
    float: left;
    font-family: weathertext, system;
    -o-font-smoothing: antialiasedleft: 0;
    bottom: 0;
    right: 0;
    position: relative;
    margin: 40px 10px 10px 40px;
    left: -10px;
    top: 13px
}

.simsek {
    width: 5rem;
    height: 4.5rem;
    font-size: 1.55rem;
    padding-top: 12px;
    color: #f8f8f8;
    border-bottom: 18px solid rgba(56, 56, 60, 1);
    align-items: center;
    justify-content: center;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.simsekdata,
.simsektoday {
    position: absolute;
    font-size: .7rem
}

.simsektoday {
    margin-top: -16px;
    margin-left: 1.7rem;
    text-align: center;
    z-index: auto;
    color: #aaa;
    font-family: Arial, system
}

.simsekdata {
    font-family: Arial, Helvetica, system;
    color: #fff;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 4px auto auto;
    left: 28.1%
}

topblue1,
topgreen1,
toporange1,
topred1,
topyellow1 {
    width: 3.3rem;
    height: 2.4rem;
    font-size: .8rem;
    padding-top: 7px;
    color: #fff;
    border-bottom: 11px solid rgba(56, 56, 60, 1);
    align-items: center;
    justify-content: center;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    position: absolute;
    margin-left: 133px;
    top: -5px
}

.topmax,
.topmin {
    position: absolute;
    margin-top: 39px;
    font-size: 0;
    padding-right: 4px;
    padding-left: 0
}

topred1 {
    background: rgba(211, 93, 78, 1)
}

toporange1 {
    background: #ff8841
}

topgreen1 {
    background: #9aba2f
}

topblue1 {
    background: #01a4b4
}

topyellow1 {
    background: rgba(233, 171, 74, 1)
}

.topmin {
    left: -100px
}

.topmax {
    left: 10px
}

.maxword,
.minword {
    position: absolute;
    margin-top: 35px;
    font-size: .55rem;
    color: #fff;
    white-space: nowrap;
}

.maxword {
    margin-left: 157px
}

.minword {
    margin-left: 47px
}

.maxtimedate,
.mintimedate {
    margin-top: 61px;
    font-size: .54rem;
    color: #aaa;
    width: 50px;
    position: absolute
}

.maxtimedate {
    margin-left: 140px
}

.mintimedate {
    margin-left: 30px
}

smallwindunit {
    font-size: .45rem;
    font-family: Arial, Helvetica, system;
    padding-left: 2px
}

.yearwordbig {
    position: absolute;
    margin-left: 11px;
    margin-top: 34px;
    font-size: 1.4rem;
    color: rgba(86, 95, 103, .2);
    width: 200px;
    font-family: weathertext, Arial, system
}

.airvalue {
    position: relative;
    margin-top: 75px;
    left: 5px;
    top: 5px;
    font-size: .9rem
}

airdescription {
    font-size: 16px;
    left: -15px;
    line-height: 26px;
    text-align: left;
    width: 300px;
    margin-top: 0
}

.air0,
.air100,
.air150,
.air200,
.air300,
.air50 {
    font-family: weathertext, Arial, Helvetica, system;
    width: 5rem;
    height: 4.68rem;
    font-size: 1.5rem;
    padding-top: 0;
    color: #fff;
    border-bottom: 15px solid rgba(56, 56, 60, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.air0 {
    background: rgba(144, 177, 42, 1)
}

.air50 {
    background: rgba(230, 161, 65, 1)
}

.air100 {
    background: rgba(255, 124, 57, .8)
}

.air150 {
    background: rgba(211, 93, 78, .8)
}

.air200,
.air250,
.air300 {
    background: #a475cb
}

supdavis {
    top: -.5em;
    font-size: .5em
}

.windunitidgust,
.windunitidspeed {
    color: #aaa;
    margin-top: -35px;
    font-size: 10px;
    position: absolute;
    width: 55px;
}

.windunitidgust {
    margin-left: 0px
}

.windunitidspeed {
    margin-left: 0
}

.windunitgust,
.windunitspeed {
    color: #aaa;
    margin-top: 7px;
    font-size: 10px;
    position: absolute
}

.windunitgust {
    margin-left: 15px
}

.windunitspeed {
    margin-left: 15px
}

.weather34indoorword {
    margin-left: 140px;
    margin-top: 26px;
    color: #aaa;
    font-size: 0.55rem;
    font-family: arial, system;
    position: absolute
}

.homeindoorhum0-25,
.homeindoorhum25-35,
.homeindoorhum35-60,
.homeindoorhum60-80,
.homeindoorhum80-100 {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 1.1rem;
    width: 4rem;
    border: 2px solid rgba(56, 56, 60, 1);
    overflow: hidden;
    border-radius: 2px;
    color: #fff;
    line-height: 16px;
    font-family: weathertext2, Helvetica, system;
    font-size: .9em;
    margin-top: -30px;
    margin-left: 165px
}

.homeindoorhum80-100 {
    background: rgba(0, 164, 180, 1);
    background: -webkit-linear-gradient(270deg, #00a4b4, #087883);
    background: -o-linear-gradient(270deg, #00a4b4, #087883);
    background: -moz-linear-gradient(270deg, #00a4b4, #087883);
    background: -ms-linear-gradient(270deg, #00a4b4, #087883);
    background: linear-gradient(270deg, #00a4b4, #087883)
}

.homeindoorhum60-80 {
    background: #3b9cac;
    background: -webkit-linear-gradient(90deg, #90b12a, #3b9cac);
    background: -o-linear-gradient(90deg, #90b12a, #3b9cac);
    background: -moz-linear-gradient(90deg, #90b12a, #3b9cac);
    background: -ms-linear-gradient(90deg, #90b12a, #3b9cac);
    background: linear-gradient(90deg, #90b12a, #3b9cac)
}

.homeindoorhum35-60 {
    background: #90b12a;
    background: -webkit-linear-gradient(90deg, #90b12a, #e6a141);
    background: -o-linear-gradient(90deg, #90b12a, #e6a141);
    background: -moz-linear-gradient(90deg, #90b12a, #e6a141);
    background: -ms-linear-gradient(90deg, #90b12a, #e6a141);
    background: linear-gradient(90deg, #90b12a, #e6a141)
}

.homeindoorhum25-35 {
    background: -webkit-linear-gradient(90deg, #d86858, #90b12a);
    background: -o-linear-gradient(90deg, #d86858, #90b12a);
    background: -moz-linear-gradient(90deg, #d86858, #90b12a);
    background: -ms-linear-gradient(90deg, #d86858, #90b12a);
    background: linear-gradient(90deg, #d86858, #90b12a)
}

.homeindoorhum0-25 {
    background: #d05f2d;
    background: -webkit-linear-gradient(90deg, #d35d4e, #d05f2d);
    background: -o-linear-gradient(90deg, #d35d4e, #d05f2d);
    background: -moz-linear-gradient(90deg, #d35d4e, #d05f2d);
    background: -ms-linear-gradient(90deg, #d35d4e, #d05f2d);
    background: linear-gradient(90deg, #d35d4e, #d05f2d)
}

.weather34indoorhumrate,
weather34feelsrate {
    position: absolute;
    margin-top: -5px;
    font-size: 12px;
    max-height: 100px;
    font-family: arial, system
}

.weather34indoorhumrate {
    color: #bbb;
    margin-left: 24px
}

.weather34indoorhumrate span {
    color: #bbb;
    font-family: arial, system
}

.weather34feelsrate {
    color: #bbb;
    margin-left: 246px
}

.weather34feelsrate span {
    color: #bbb;
    font-family: arial, system
}

.feelsindoorcircleblue,
.raintoday1,
.suncircleblue,
indoorblue1,
topblue1 {
    background: #3b9cac
}

.indoorhomesvg1 {
    margin-top: -12px;
    left: 0;
    color: #38383c
}

.updatedtime,
.updatedtimealert,
.updatedtimecurrent,
.updatedtimedir,
.updatedtimeuv {
    width: 75px;
    text-align: center
}

.updatedtime,
.updatedtimeuv {
    font: .65em weathertext2;
    margin-left: 235px;
    color: silver;
    background: 0;
    padding: 3px
}

.updatedtime,
updatedtime1 {
    margin-top: -18px;
    line-height: 10px
}

.updatedtimeuv {
    margin-top: -112px;
    line-height: 10px
}

.updatedtimeuv span {
    color: silver
}

.updatedtimecurrent {
    margin-top: -18px;
    margin-left: 235px;
    color: silver;
    font: .65em weathertext2;
    line-height: 10px;
    background: 0;
    padding: 3px
}

.updatedtimealert {
    margin-top: 5px;
    margin-left: 215px;
    color: silver;
    font: .65em weathertext2;
    line-height: 10px
}

.updatedtimedir {
    margin-top: -25px;
    margin-left: 135px;
    position: absolute;
    color: silver;
    font: .65em weathertext2;
    line-height: 10px;
    border-radius: 2px;
    background: 0;
    padding: 3px
}

updatedtime {
    position: absolute
}

.updatedtime span,
.updatedtimealert span,
.updatedtimecurrent span,
.updatedtimedir span {
    margin-bottom: 0;
    color: silver;
    font-family: weathertext2;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased
}

.homeweatherstationlogo {
    margin-top: -15px;
    margin-left: 50px
}

weather34 {
    font: .55em weathertext2;
    margin-top: -4px;
    margin-left: 45px;
    display: block;
    width: 100px
}

valueearthquake {
    font-size: .55rem;
    line-height: 10px
}

alertvalue {
    font-size: .75rem;
    margin-top: 10px
}

spanefreezing {
    font-size: 12px;
    font-family: Arial, system;
    top: 0px;
    width: 120px;
    position: absolute;
    font-weight: 400;
    left: 50px
}

alertadvisory {
    margin-left: 25px;
    position: absolute
}

valuewindunit {
    font-size: .55rem
}

.inheatcircle-content {
    position: absolute;
    color: silver;
    float: left;
    margin-left: -4px;
    padding: 0;
    text-align: center;
    width: 160px;
    font: 500 11px weathertext2;
    display: block;
    line-height: 15px
}

.heatcircle6 {
    padding: 0;
    width: 170px;
    position: absolute;
    margin-top: -35px;
    margin-left: 140px
}

.inheatcircle2-content {
    position: absolute;
    color: silver;
    float: left;
    margin-top: 35px;
    margin-left: -5px;
    padding: 0;
    text-align: center;
    width: 160px;
    font: 500 11px weathertext2;
    display: block;
    line-height: 15px
}

.heatcircle7 {
    padding: 0;
    width: 170px;
    position: relative;
    margin-top: 50px;
    margin-left: 49px
}

.intemphumcircle0-25,
.intemphumcircle25-35,
.intemphumcircle35-60,
.intemphumcircle60-80,
.intemphumcircle80-100 {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 1.1rem;
    width: 4rem;
    overflow: hidden;
    line-height: 16px;
    font-family: weathertext2;
    font-size: .85em;
    color: silver
}

.intemphumcircle60-80 {
    border: 1px solid #393d40;
    border-left: 0;
    box-shadow: inset 4px 0 0 0 #e6a141;
    -webkit-border-top-right-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.intemphumcircle25-35 {
    border: 1px solid #393d40;
    border-left: 0;
    box-shadow: inset 4px 0 0 0 #d05f2d;
    -webkit-border-top-right-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.intemphumcircle35-60 {
    border: 1px solid #393d40;
    border-left: 0;
    box-shadow: inset 4px 0 0 0 #90b12a;
    -webkit-border-top-right-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.intemphumcircle80-100 {
    border: 1px solid #393d40;
    border-left: 0;
    box-shadow: inset 4px 0 0 0 #4e95a0;
    -webkit-border-top-right-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

.intemphumcircle0-25 {
    border: 1px solid #393d40;
    border-left: 0;
    box-shadow: inset 4px 0 0 0 #d35d4e;
    -webkit-border-top-right-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

greyu {
    font-size: .55rem;
    font-family: weathertext2;
    color: silver
}

valuetitleunit {
    font-size: .8em;
    font-family: weathertext2
}

orangeu {
    color: #d05f2d
}

greenu {
    color: #90b12a
}

yellowu {
    color: #e6a141
}

redu {
    color: #cd5245
}

purpleu {
    color: #b600b0
}

bluet {
    color: #01a4b5;
}

yellowt {
    color: #e6a141;
}

oranget {
    color: #d05f2d;
}

greent {
    color: #90b12a;
}

redt {
    color: #d86858
}

purplet {
    color: #de7b6e
}

.airqualitywordbig {
    position: absolute;
    margin-left: 50px;
    margin-top: 15px;
    font-size: 1.4rem;
    color: rgba(86, 95, 103, .2);
    width: 200px;
    font-family: weathertext2
}

.tempconvertercircle0-5,
.tempconvertercircle11-15,
.tempconvertercircle16-20,
.tempconvertercircle21-25,
.tempconvertercircle26-30,
.tempconvertercircle31-35,
.tempconvertercircle36-40,
.tempconvertercircle41-45,
.tempconvertercircle50,
.tempconvertercircle6-10,
.tempconvertercircleminus,
.tempconvertercircleminus10,
.tempconvertercircleminus5 {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 1rem;
    width: 3.4rem;
    border: 1px solid #393d40;
    overflow: hidden;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    color: silver;
    line-height: 16px;
    font-family: weathertext2;
    font-size: .85em;
    background: 0
}

.darkskyhomeicons {
    margin-bottom: -2px
}

bluetds,
greentds,
orangetds,
purpletds,
redtds,
yellowtds {
    color: #fff;
    text-transform: capitalize;
    border-radius: 2px;
    width: 35px;
    padding: 0 3px
}

bluetds {
    background: #01a4b5
}

yellowtds {
    background: #e6a141
}

orangetds {
    background: #d05f2d
}

greentds {
    background: #90b12a
}

redtds {
    background: -webkit-linear-gradient(90deg, #d86858, rgba(211, 93, 78, .7));
    background: linear-gradient(90deg, #d86858, rgba(211, 93, 78, .7))
}

purpletds {
    background: -webkit-linear-gradient(90deg, #d86858, rgba(157, 59, 165, .4));
    background: linear-gradient(90deg, #d86858, rgba(157, 59, 165, .4))
}

.airqualitywordbig,
.uvsolarwordbig {
    position: absolute;
    font-size: 1.4rem;
    color: rgba(86, 95, 103, .2);
    width: 200px;
    font-family: weathertext2
}

.uvsolarwordbig {
    margin-left: 115px;
    margin-top: 35px
}

.airqualitywordbig {
    margin-left: 50px;
    margin-top: 15px
}