/* * * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) * http://cssreset.com */ #plemx-root html, #plemx-root body, #plemx-root div, #plemx-root span, #plemx-root applet, #plemx-root object, #plemx-root iframe, #plemx-root h1, #plemx-root h2, #plemx-root h3, #plemx-root h4, #plemx-root h5, #plemx-root h6, #plemx-root p, #plemx-root blockquote, #plemx-root pre, #plemx-root a, #plemx-root abbr, #plemx-root acronym, #plemx-root address, #plemx-root big, #plemx-root cite, #plemx-root code, #plemx-root del, #plemx-root dfn, #plemx-root em, #plemx-root img, #plemx-root ins, #plemx-root kbd, #plemx-root q, #plemx-root s, #plemx-root samp, #plemx-root small, #plemx-root strike, #plemx-root strong, #plemx-root sub, #plemx-root sup, #plemx-root tt, #plemx-root var, #plemx-root b, #plemx-root u, #plemx-root i, #plemx-root center, #plemx-root dl, #plemx-root dt, #plemx-root dd, #plemx-root ol, #plemx-root ul, #plemx-root li, #plemx-root fieldset, #plemx-root form, #plemx-root label, #plemx-root legend, #plemx-root table, #plemx-root caption, #plemx-root tbody, #plemx-root tfoot, #plemx-root thead, #plemx-root tr, #plemx-root th, #plemx-root td, #plemx-root article, #plemx-root aside, #plemx-root canvas, #plemx-root details, #plemx-root embed, #plemx-root figure, #plemx-root figcaption, #plemx-root footer, #plemx-root header, #plemx-root hgroup, #plemx-root menu, #plemx-root nav, #plemx-root output, #plemx-root ruby, #plemx-root section, #plemx-root summary, #plemx-root time, #plemx-root mark, #plemx-root audio, #plemx-root video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ #plemx-root article, #plemx-root aside, #plemx-root details, #plemx-root figcaption, #plemx-root figure, #plemx-root footer, #plemx-root header, #plemx-root hgroup, #plemx-root menu, #plemx-root nav, #plemx-root section { display: block; } #plemx-root body { line-height: 1; } #plemx-root ol, #plemx-root ul { list-style: none; } #plemx-root blockquote, #plemx-root q { quotes: none; } #plemx-root blockquote:before, #plemx-root blockquote:after, #plemx-root q:before, #plemx-root q:after { content: ''; content: none; } #plemx-root table { border-collapse: collapse; border-spacing: 0; } #plemx-root .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } #plemx-root .clearfix { display: inline-block; } /* start commented backslash hack \ */ #plemx-root * html .clearfix { height: 1%; } #plemx-root .clearfix { display: block; } /* close commented backslash hack */ #plemx-root * { box-sizing: border-box; } #plemx-root body { font-family: 'DIN-Regular', sans-serif; color: #333; } /* h2.heading { font-weight: normal;} */ #plemx-root .header-wrap .heading { font-size: 1.5em; margin: 0.83em 0; color: #333; padding-bottom: 30px; } #plemx-root .message { clear: both; width: 690px !important; font-size: 1em; line-height: 1.4; margin: 20px 0; } #plemx-root a { text-decoration: none; } #plemx-root .weather-button { margin: auto; overflow: hidden; box-shadow: 0 0 10px rgba(0, 0, 0, 0.35); /*height: 100%;*/ } #plemx-root .pelm-container { overflow: hidden; } #plemx-root .locations, #plemx-root .button_locations { height: 20px; /*overflow: hidden;*/ color: #203c73; font-size: 13px; } #plemx-root .locations.alert { background: #a60200 url('alert.jpg') right 2px center no-repeat; color: #fff; padding-right: 20px; width: 100%; } #plemx-root .locations.alert_height_30 { background: #a60200 url('alert.jpg') right 2px center no-repeat; color: #fff; padding-right: 20px; height: 30px; } #plemx-root .header { background: #faed51; float: left; overflow: hidden; } #plemx-root .logo { height: 20px; width: 80px; float: left; padding: 2px 2%; } #plemx-root .logo-100 { height: 20px; float: left; padding: 2px 2%; text-align: left; } #plemx-root .heading { color: #203c73; } #plemx-root .city { width: 100%; float: left; height: 20px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; text-align: center; } #plemx-root .search { width: 100%; height: 20px; background: #c3c3c4; } #plemx-root .current-weather { padding: 3%; overflow: hidden; } #plemx-root .current-weather-100 { margin: 5% 0 0 8%; } #plemx-root .icon { width: 25%; max-width: 60px; float: left; margin-right: 10px; } #plemx-root .small-icon { width: 10%; max-width: 60px; float: left; margin-right: 10px; } #plemx-root .medium-icon { width: 15%; max-width: 60px; float: left; margin-right: 10px; } #plemx-root .temp { font-size: 20px; margin: 2px 10px 0 0; float: left; color: #203c73; } #plemx-root .temp span { font-size: 12px; font-weight: bold; bottom: 6px; position: relative; } #plemx-root .condition { font-size: 11px; overflow: hidden; text-overflow: ellipsis; /*color: #203c73;*/ } #plemx-root .chk_wrapper > input[type=checkbox] { margin: 0 5px; } #plemx-root #select_location { border: 1px solid #fff; font-size: 13px !important; } /* DROPDOWN */ #plemx-root .weather-button .selector { border: none; width: 100%; float: left; font-size: 14px; color: #203c73; height: 20px; line-height: 20px; overflow: hidden; padding-left: 7px; position: relative; } #plemx-root .weather-button .selector span { background: url("arrow-select.png") no-repeat scroll 100% -4px transparent; font-size: 14px; color: #203c73; cursor: pointer; display: block; height: 20px; line-height: 20px; overflow: hidden; padding: 0 15px 0 0; text-overflow: ellipsis; white-space: nowrap; width: 90%; } #plemx-root .weather-button .selector select { height: 20px; margin: 0 !important; opacity: 0; position: absolute; top: 0; } #plemx-root .weather-button .alert .selector span { color: #fff; background: url("arrow-select-alert.png") no-repeat scroll 100% -4px transparent; } #plemx-root .input_searchbox { background: url("magnifying-glass.png") no-repeat scroll right 2px center #c3c3c4; border: none; font-size: 12px; overflow: hidden; text-overflow: ellipsis; width: 100%; height: 20px; margin: 0; } /* VERSION 1 */ #plemx-root .pelm-container.no-heading .heading_widget, #plemx-root .pelm-container.no-location .location { display: none; } #plemx-root .pelm-container.one .heading_widget { display: none; } #plemx-root .weather-button.one .locations.alert { float: left; width: 100px; } #plemx-root .weather-button.one .locations.alert .city { padding-left: 5px; } #plemx-root .weather-button.one .logo { float: left; height: 20px; padding: 2px 2%; width: 100px; } #plemx-root .weather-button.one .condition { display: none; } #plemx-root .weather-button.one .icon { width: 25%; max-width: 30px; } #plemx-root .weather-button.one.height1 .condition { display: none; } #plemx-root .weather-button.one.height2 .header, #plemx-root .weather-button.one.height2 .temp { float: none; } #plemx-root .weather-button.one.height2 .condition { clear: both; text-align: center; display: none; } #plemx-root .weather-button.one.height2 .city { text-align: center; } #plemx-root .weather-button.one.height3 .header, #plemx-root .weather-button.one.height3 .temp { float: none; } #plemx-root .weather-button.one.height3 .condition { clear: both; text-align: center; display: none; } #plemx-root .weather-button.one.height3 .city { text-align: center; } /* VERSION 2 */ #plemx-root .weather-button.two .current-weather { padding: 5% 18%; } #plemx-root .weather-button.two.height90 .city { text-align: center; } #plemx-root .weather-button.two.height120 .header, #plemx-root .weather-button.two.height120 .temp { float: none; } #plemx-root .weather-button.two.height120 .temp { font-size: 26px; margin-top: 3px; } #plemx-root .weather-button.two.height120 .temp span { font-size: 14px; bottom: 8px; } #plemx-root .weather-button.two.height120 .icon { width: 40%; max-width: 50px; } #plemx-root .weather-button.two.height120 .city { text-align: center; } #plemx-root .weather-button.two .header, #plemx-root .weather-button.two .temp { float: none; } #plemx-root .weather-button.two .temp { font-size: 26px; margin-top: 3px; } #plemx-root .weather-button.two .temp span { font-size: 14px; bottom: 8px; } #plemx-root .weather-button.two .icon { width: 40%; max-width: 50px; } #plemx-root .weather-button.two .city { text-align: center; } /* VERSION 3 */ #plemx-root .weather-button.three .current-weather { padding: 1% 4%; } #plemx-root .weather-button.three .header, #plemx-root .weather-button.three .temp { float: none; } #plemx-root .weather-button.three .heading_widget { border-top: 1px solid #ccc; font-size: 11px; font-weight: bold; line-height: 25px; text-align: center; } #plemx-root .weather-button.three .condition { clear: both; text-align: center; } #plemx-root .weather-button.three .temp { font-size: 24px; margin-top: 3px; } #plemx-root .weather-button.three .temp span { font-size: 12px; bottom: 8px; } #plemx-root .weather-button.three .icon { width: 40%; max-width: 40px; } #plemx-root .weather-button.three .city { text-align: center; } /* VERSION 4 */ #plemx-root .weather-button.four .current-weather { margin-top: 2px; float: left; width: 50%; border-top: 1px solid #ccc; } #plemx-root .weather-button.four .logo, .weather-button.four .logo-100 { width: 180px; } #plemx-root .weather-button.four .heading_widget { font-size: 10px; font-weight: bold; text-align: center; height: 20px; } #plemx-root .weather-button.four .locations { float: left; width: 180px; } #plemx-root .weather-button.four .locations .city { padding-left: 5px; } #plemx-root .weather-button.four .locations.alert { float: left; width: 180px; } #plemx-root .weather-button.four .condition { clear: both; text-align: center; } #plemx-root .weather-button.four #next_weather.current-weather { border-left: 1px solid #ccc; } #plemx-root .weather-button.four .temp { font-size: 20px; margin: 3px !important; } #plemx-root .weather-button.four .temp span { font-size: 10px; bottom: 8px; } #plemx-root .weather-button.four .icon { width: 35%; max-width: 30px; margin-top: 2px; margin-right: 2px; } /* width wider than 180px */ #plemx-root .weather-button.three.width2 .current-weather { width: 50%; float: left; } /* VERSION 5 */ #plemx-root .weather-button.five .logo { height: 30px; width: 80px; float: left; padding: 8px 8%; } #plemx-root .weather-button.five .current-weather { padding: 1% 3%; height: 30px; } #plemx-root .weather-button.five .locations { float: left; width: 125px; } #plemx-root .weather-button.five .locations.alert { height: 30px; width: 115px; } #plemx-root .weather-button.five .icon { width: 25%; max-width: 30px; } #plemx-root .weather-button.five .button_locations { float: left; } #plemx-root .weather-button.five .locations .city { text-align: center; padding-left: 5px; height: 30px; line-height: 30px; } #plemx-root .weather-button.five.height1 .condition { display: none; } #plemx-root .weather-button.five .temp { margin-right: 0px; } #plemx-root .weather-button.five .selector { width: 115px; height: 30px; line-height: 30px; } #plemx-root .weather-button.five .selector span { background: url("arrow-select.png") no-repeat scroll 100% 0 transparent; height: 30px; line-height: 30px; width: 100%; } #plemx-root .weather-button.five .locations.alert .selector { width: 100px; height: 30px; line-height: 30px; } #plemx-root .weather-button.five .alert .selector span { background: url("arrow-select-alert.png") no-repeat scroll 100% 0 transparent; height: 30px; line-height: 30px; } #plemx-root .weather-button.five .selector select { height: 30px; } #plemx-root a, #plemx-root img { border: none; outline: none; padding: 0px; } #plemx-root #main_button .header img { vertical-align: top; } #plemx-root #main_button .current-weather img { vertical-align: middle; } #plemx-root .locations.alert div.selector span { color: #FFFFFF; } /* transcontinental widget - CSS * */ #plemx-root .widget6 { width: 70px; height: 65px; background-color: #ededed; position: relative; } #plemx-root .widget6 a { text-decoration: none; /*color: #333;*/ } #plemx-root .widget6 .cityName { float: left; padding-left: 5px; font-size: 13px; letter-spacing: -0.1px; width: 70px; } #plemx-root .widget6 .tempIcon { width: 25px; height: 25px; float: left; position: relative; padding-left: 5px; } #plemx-root .widget6 .alertIcon { width: 14px; height: 11px; background: url("alert-icon.png") no-repeat scroll right; position: absolute; top: 18px; } #plemx-root .widget6 .mainTemp { float: left; line-height: 1.5; padding-left: 8px!important; padding-bottom: 11px!important; } #plemx-root .widget6 .mainTemp span { font-size: 10px; position: relative; bottom: 5px; letter-spacing: 1px; } #plemx-root .widget6 .lang { font-size: 9px; font-family: "DIN-Regular", sans-serif; display: block; width: 103%; letter-spacing: -0.2px; color: inherit !important; position: absolute; top: 53px; left: -1px; text-align: center; }