﻿/***** jweather_modals *****/

/*.wfmodal-profile-table-header {
    border-bottom: 1px solid #ffffff
}*/

.wfmodal-table td {
    padding: 3px
}
.wfmodal-table td.wfcontainer-center {
    text-align: center
}
.wfmodal-message {
    text-align: center;
    padding: 5px;
    display: none;
}
.wfmodal-favorite {
    cursor: pointer;
    width: 25px;
    height: 25px;
    background-image: url(https://cdn-consumer.weatherflow.com/images/svg-icons/gray/star.svg);
    background-size: 25px 25px;
    background-repeat: no-repeat;
}
.wfmodal-favorite:hover {
    opacity: .70
}
.wfmodal-favorite-yellow {
    cursor: pointer;
    width: 25px;
    height: 25px;
    background-image: url(https://cdn-consumer.weatherflow.com/images/svg-icons/yellow/star.svg);
    background-size: 25px 25px;
    background-repeat: no-repeat;
}
.wfmodal-favorite-yellow:hover {
    opacity: .70
}
.wfmodal-input-field-container {
    display: flex;
    width: 100%;    
}
.wfmodal-input-field-label {
    padding-right: 15px;
    padding-top: 8px;
    min-width: 80px;
}
.wfmodal-input-field-label span {
    font-weight: bold
}
.wfmodal-input-field-container div {
    float: left
}
.wfmodal-body {
    padding: 25px 10px;
}
.wfmodal-body p {
    color: #fff;
    margin: 0 0 0 0;
    width: 435px;
}
.wfmodal-buttons {
    clear: both;
    text-align: right;    
    padding: 15px 0;
}
.wfmodal-buttons-new {
    clear: both;
    display: block;
    float: none;
    margin-left: -24px;
    height: 28px;
    width: 480px;
    text-align: center;
}
.wfmodal-buttons ul li {
    display: inline;
    list-style: none;
}
.wfmodal-links-ul {
    margin-top: 8px;
}
.wfmodal-links-ul li {
    display: inline;
    list-style: none;    
}
.wfmodal-main-buttons {
    margin-bottom: 10px
}
.wfmodal-links-ul li {
    padding: 3px 8px
}
.wfmodal-buttons-ul li {
    display: inline;
    font-size: 11px;
    padding: 0 6px 0 0;
}
.wfmodal-footer {
    clear: both;
    min-height: 5px;
    padding-top: 5px;
    text-align: center;
    padding-bottom: 10px;
}
.wfmodal-header span.title,
.wfmodal-header h2.title,
.ui-dialog .ui-dialog-title {
    color: #FFF;
    font-size: 18px;
    font-weight: bold;
}
.wfmodal-textfield input {
    min-width: 250px;    
    padding-left: 5px;
    height: 20px;
}
.field-wrap label {
    line-height: 30px;
    vertical-align: baseline;
}
.field-wrap input {
    max-width: 300px;
    min-width: 150px;
    width:80%;
    float: right;
}
.wfmodal {    
    display: none;
    position: fixed !important;
    top: 0 !important;    
    left: 0 !important;        
    right: 0;
    bottom: 0;
    margin: 0 !important;
    background: rgba(0,0,0,0.8);
    color: #3A3B44;
}

.touch .wfmodal {
    position: absolute !important;
}

.wfmodal-ctn {
    background-color: #fff;
    width: 80%;
    min-width: 300px;
    max-width: 450px;
    margin: 30px auto 0 auto;
}

.touch .wfmodal-close-ctn {
    display: none;
}

.touch .wfmodal select, .touch .wfmodal textarea, .touch .wfmodal input {
    font-size: 16px;
}

.wfmodal-white {
    display: none;
    position: fixed;
    top: 20%;
    background-color: #fff;
    border: 5px solid #CECECE;
    padding: 5px;
    left: 15%;
    width: 70%;
}
.wfmodal-white .info-window-content {
    margin-top: 30px;
    color: #000000;
}
.info-window-content p {
    padding: 10px
}
.wfmodal-profile-scroller {
    clear: both;
    display: block;
    float: none;
    max-height: 140px;
    overflow: auto;
    margin-bottom: 15px;
    margin-top: 15px;
}
.wfmodal a {
    color: #3A3B44;
    text-shadow: none;
    text-decoration: none;
}
.wfmodal a:hover {
    text-decoration: underline
}
.wfmodal-status-good {
    padding: 20px;
    color: #ffffff;
    font-weight: bold;
}
.wfmodal-status-bad {
    padding-left: 20px;
    color: #FF4D4D;
    font-weight: bold;
}
.wfmodal-label {
    color: #FFF;
    font-weight: bold;
    padding-right: 8px;
    width: 60px;
    text-align: right;
    display: inline-block;
    vertical-align: top;
}
.wfmodal-value-text {
    width: 300px;
    display: inline-block;
}
.wfmodal-instructions {
    color: #eee;
    font-size: 12px;
}
#profileListTable th {
    background-color: #E7E7E7;
    font-weight: 900;
    padding: 3px;
    text-align: left;
}
#profileListTable th.starColumn {
    width: 100px;
    margin-left: 5px;
}
#profileListTable td.starColumn div {
    margin: 0 auto
}
#profileListTable td {
    padding: 3px;
    border-bottom: 1px solid #e7e7e7;
}
#wfmodal-loading .wfmodal-title {
    text-align: center;
    margin-top: 15px;
}
#wfmodal-loading .wfmodal-body div {
    height: 16px;
    width: 16px;
    margin: 0 auto;
}

/* jQuery Modals */
.jw-modal-name-msg {
    line-height: 1.5em;
    margin-bottom: 10px;
}

#jw-modal-input-name {
    margin-left: 9px;
    width: 260px;
}

.ui-state-error {
    margin-top: 4px;
}
/* jQuery Modals */

/***** jweather_modals *****/

/***** jweather_map *****/

/* Common */
.jw-map-control {
    z-index: 1;
}

.membership-control {
    border: none;
    color: #fff;    
    padding: 6px 10px;
    font-weight: 700;        
    cursor: pointer;
    background-color: rgba(24, 123 ,222, .5);
    border-radius: var(--border-radius, 5px);
    margin: 0;
    border-bottom: 5px solid rgba(24, 123 ,222, .2);
}

.membership-control.selected,
a.membership-control:hover {
    text-decoration: none;    
    background-color: rgba(24,123,222, .7);
    border-bottom: 5px solid #187bde;
}
/* Common */

/* Profile Map */
.spotInfoContainer .jw-map-ctn {    
    width: 100%;
    position: relative;        
}
/* Profile Map */

/* Cosmos */
.fullwidth .jw-map-ctn {
    position: absolute;
    display: block;
    width: auto;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin-left: 0;
    transition: 400ms;
    color: #222;    
}

.jw-panel h2 span {
    position: absolute;
    right: 0;
    top: 50%;
    margin-right: 10px;
    margin-top: -8px;
    cursor: pointer;
}

.jw-panel h2 .ui-icon {
    background-image: url(../jQuery/themes/pro-ui/images/ui-icons_ffffff_256x240.png);
}

.jw-panel h3 {
    margin: 8px 0 5px;
    font-weight: 900;
}

.jw-section-content {
    padding: 8px;
    -webkit-overflow-scrolling: touch;
}

.jw-section-content select {
    width: 90%;
}

.jw-section-content li {
    line-height: 26px;
    vertical-align: baseline;
}

.jw-section-content li input {
    line-height: 26px;
    vertical-align: middle;
}

.jw-section-content li label {
    line-height: 26px;
    vertical-align: middle;    
}

.jw-map-customize-global {
    padding: 8px 0 15px;
}
/* Cosmos */

/* Map Header */
.pnl-btn {
    position: absolute;
    z-index: 50;
    display:block;
    height: 40px;    
    overflow:hidden;
    background-color: #94cb68;
    background-repeat: no-repeat;
    background-position: 50% 50%;    
    opacity: .9;
    border: 1px solid #578F40;
}

.pnl-btn:hover {
    opacity: 1;
}

.left-pnl-btn {
    top: 0;
    left: 0;
    background-image: url(images/panel-menu.png);
    width: 60px;
    border-radius: 0px 5px 5px 0px;
    -moz-border-radius: 0px 5px 5px 0px;
    -webkit-border-radius: 0px 5px 5px 0px;    
}

.right-pnl-btn {
    top: 0;
    right: 0;
    background-image: url(images/spot-menu.png);
    width: 60px;
    border-radius: 5px 0px 0px 5px;
    -moz-border-radius: 5px 0px 0px 5px;
    -webkit-border-radius: 5px 0px 0px 5px;    
    border-right-width: 0;
}

.storm-pnl-btn {
    top: 50px;
    right: 0;
    width: 60px;
    background-image: url(images/storm-btn.png);
    border-radius: 5px 0px 0px 5px;
    -moz-border-radius: 5px 0px 0px 5px;
    -webkit-border-radius: 5px 0px 0px 5px;    
    border-right-width: 0;
}

.expanded-right-detail .right-pnl-btn {
    background-image: url(images/rp-close.png);
}

.expanded-right-storm .storm-pnl-btn {
    background-image: url(images/rp-close.png);
}

.jw-map-button-submenu {
    position: absolute;    
    right: 0; 
    padding: 5px;
    margin-top: -1px;
}
.jw-map-buttons {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 5;
}
.jw-map-buttons li {
    float: left;
    position: relative;
}
.jw-opfx-menu {
    max-height: 300px;    
    overflow: auto;
}
.jw-opfx-menu ul li {
    display: block;
    font-size: 11px;
    line-height: 18px;
    float: none;
}
.jw-opfx-menu h4 {    
    font-weight: bold;
    font-size: 14px;
    padding-bottom: 5px;
}

.jw-map-selector {
    min-width: 245px;
}

.jw-map-selector, .jw-panel-hdr {        
    background-color: #94CB68;
    background-image:none;
    border: 1px solid #578F40;
    opacity: 0.9;
    filter: alpha(opacity: 90);
    white-space: nowrap;
}

.jw-map-selector .ui-button-text {
    font-weight: bold;
    padding: .4em 1em .4em 30px;
}

.jw-map-selector .ui-icon {
    background-image: url(images/panel-menu.png);
    height: 24px;
    width: 24px;
    margin-top: -12px;
    background-position: 0 0;    
}

.jw-map-view-list {    
    padding-bottom: 10px;
}
.jw-map-view-list ul {
    padding-bottom: 10px
}
.jw-map-view-list ul li {
    position: relative;
    display: block;
    margin: 10px 0;
    padding: 5px;        
    font-weight: bold;
    font-size: 13px;
    line-height: 1.2;
    cursor: pointer;
    -webkit-transition: 0.25s;
    -moz-transition: 0.25s;
    -o-transition: 0.25s;
    transition: 0.25s; 
}
.jw-map-view-list ul li img {
    float: left;
    margin: 0 15px 0 0;
}
.jw-map-view-list h3 {
    font-weight: bold;
    font-size: 13px;
}
.jw-map-view-list span.jw-regional-product-toggle-icon {
    position: absolute;
    right: 5px;
    top: 5px;
}
.jw-map-view-list .jw-product-menu {
    margin: 25px 0 0 0;
}
.jw-map-view-list .jw-product-menu h3 {
    clear: both;
    padding-bottom: 5px;
}
.jw-map-view-list .jw-product-menu li {
    font-weight: normal;
    font-size: 12px;
    border: none;
    padding: 2px 0;
    margin: 0 0 0 8px;
}
.jw-map-view-list .jw-product-menu li a {    
    text-decoration: none;
    color: #222;
}
.jw-map-view-list .jw-product-menu li a:hover,
.jw-map-view-list .jw-product-menu li a.selected {    
    text-decoration: underline;
}
.jw-map-view-list .view-icon {
    width: 50px;
    height: 40px;
    float: left;
    margin: 0 15px 0 0;
    border: 1px solid #444;
}
/*.jw-map-view-list .view-obs,
.jw-map-view-list .view-fx {
    width: 25px;
    height: 25px;
    border: 1px solid #444;
}*/
.jw-map-view-list .view-1 {
    background: url(images/view-obs.jpg) no-repeat
}
.jw-map-view-list .view-2 {
    background: url(images/view-wind-fx.jpg) no-repeat
}
.jw-map-view-list .view-3 {
    background: url(images/view-nowcast.png) no-repeat
}
.jw-map-view-list .view-4 {
    background: url(images/view-general-weather.jpg) no-repeat
}
.jw-map-view-list .view-5 {
    background: url(images/view-radar.jpg) no-repeat
}
.jw-map-view-list .view-6 {
    background: url(images/view-satellite.jpg) no-repeat
}
.jw-map-view-list .view-7 {
    background: url(images/view-sst.jpg) no-repeat
}
.jw-map-view-list .view-8 {
    background: url(images/view-radar-obs.jpg) no-repeat
}
.jw-map-view-list .view-9 {
    background: url(images/view-sat-obs.jpg) no-repeat
}
.jw-map-view-list .view-10 {
    background: url(images/view-nws-fx.jpg) no-repeat
}
.jw-map-view-list .view-11 {
    background: url(images/view-briefings.png) no-repeat
}
.jw-map-view-list .view-12 {
    background: url(images/view-onsite-reports.png) no-repeat
}
.jw-map-view-list .view-13 {
    background: url(images/view-surface-currents.png) no-repeat
}
.jw-map-view-list .view-18 {
    background: url(images/view-wind-flowviz.png) no-repeat
}
.jw-map-view-list .view-19 {
    background: url(images/view-obs-gusts.jpg) no-repeat
}
.jw-map-view-list .view-23 {
    background: url(images/view-sat-radar.jpg) no-repeat
}
.jw-map-view-list .viewport {   
    height: 575px;
    overflow-x: hidden;
    overflow-y: scroll;
    position: relative;
}
.jw-map-view-list .overview {
    list-style: none;
    position: absolute;
    left: 0;
    top: 0;
}
/* Map Header */

/* Markers */
.jw-marker {
    cursor: pointer;
    -webkit-transform: translateZ(0px);
}

.jw-marker.active, .wfsvd.active, .onsite-marker.active {
    z-index: 1005 !important;
}

.jw-marker.poi div {
    display: none
}
.jw-marker.t1 {
    z-index: 5
}
.jw-marker.t1.p1 {
    z-index: 10
}
.jw-marker.t100,
.jw-marker.t101 {
    z-index: 1
}

.selected-marker {
    position: absolute;
    background: rgba(255,255,255,0.4);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 59px;
    height: 59px;
 }
 .selected-marker.WFMarker {
    margin: -29.5px 0 0 -20px;
}

.selected-marker.OnsiteReportMarker {
    margin: -45px 0 0 -17px;
}

.selected-marker.WFFXMarker {
    margin: -23px 0 0 -18px;
}

.selected-marker.WFSVD {
    margin: -27px 0 0 -27px;
}
/* Markers */

/* QuickView */
.jw-map-qv {
    position: absolute;
    z-index: 1004;
    width: 244px;        
    display: none;
    cursor: pointer;
    margin: -26px 0 0 -26px;
    -webkit-transform: translateZ(0px);
}

.jw-map-qv-extened {
    height: 200px
}

.qv-dv {
    display: inline-block;
}

.qv-condensed .jw-map-qv-wind-dir {
    top: 3px;
    left: 7px;
}

.jw-map-qv img.loading {
    background-image: url(http://i.windalert.com/loading-white.gif);
}
.jw-map-qv-obs-img {
    height: 100px;
    width: 240px;
    border: 0px;
    margin: 5px 0 0;
    overflow: hidden;
}
.jw-map-qv-obs-img .upgrade-msg {
    position: absolute;
    z-index: 200;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    border: 1px solid #222;
    padding: 10px;
    margin-top: 15px;
    margin-left: 20px;
}

.jw-map-qv-obs-img .upgrade-msg.data-restricted {
    left: 20px;
    right: 20px;
    text-shadow: -1px -1px 0 #fff,  
                1px -1px 0 #fff,
                -1px 1px 0 #fff,
                 1px 1px 0 #fff;
}

.jw-map-qv-spot-functions {
    float: left;
    width: 100%;    
    padding: 2px 0;
    margin-top: 5px;
}
.fx-qv .jw-map-qv-spot-functions {
    margin-top: 20px;
}

.jw-map-qv[data-spot-type='poi'] .jw-map-qv-spot-functions {
    margin-top: 15px;
}

.jw-map-qv-spot-functions button {
    padding: 0 !important;
    margin-left: 0 !important; 
    border: none !important;
    background: #222 none !important;      
}
.jw-map-qv-spot-functions button.jw-map-qv-forecast {
    width: 100%
}
.jw-map-qv-favorite {
    float: right;
}
.jw-map-qv-spot-functions a span.ui-icon {
    display: inline-block;
    vertical-align: middle;
    margin: -2px 0 0 3px;
}
.jw-map-qv-fx .jw-map-qv-wind-speed {
    top: 10px;
    left: 28px;
}
/* QuickView */

/* Onsite Reports */
.onsite-marker {
    cursor: pointer;
    z-index: 20;    
}

.onsite-qv {
    cursor: pointer;
    background-color: #fff;
    color: #222;
    border: 1px solid #3A3B44;
    padding: 10px;
    z-index: 200;
    margin: -45px 0 0 -22px;
    min-width: 200px;  
    max-width: 240px;  
    -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.75);
}

.onsite-qv-hdr {
    margin-left: 55px;
    min-height: 42px;
}

.onsite-qv-desc, .onsite-qv-notes {
    line-height: 1.5em;
}
.onsite-qv-pa {
    margin-top: 10px;
    text-align: right;
}

.onsite-qv-details-btn {
    margin-top: 15px;
    width: 100%;
}

.onsite-qv .onsite-evaluation {
    margin: 15px 0;
    width: 100%;
}

/* Onsite Reports */

/* Animation Controls */
.jw-map-product-controls {
    position: absolute;
    padding: 2px 5px;
    top: 40px;
    left: 45px;
    width: 522px;    
}

.map-page .jw-map-product-controls {    
    top: 80px;    
    left: 66px;
}

.jw-map-product-controls.ui-widget-header {
    border: 1px solid #000
}
.jw-map-product-controls a.jw-product-control {
    display: inline;
    float: left;
}
.jw-product-control {
    display: none
}
.jw-map-slider {
    margin-left: 50px;
    height: 18px;
    z-index: 3;
    border: none !important;
}
.jw-map-slider .jw-slider-tick {
    position: absolute;
    cursor: pointer;
    height: 18px;
    z-index: 3;
}
.jw-map-slider .jw-slider-tick.ui-state-default {
    border: 1px solid #666
}
.jw-map-slider .jw-slider-tick.ui-state-active {
    background-color: #fff;
    background-image: none;
    opacity: .9;
    filter: alpha(opacity: 90);
}
.jw-map-slider .ui-slider-handle {
    background: url(https://cdn-consumer.weatherflow.com/images/icons/white/sliderarrow.png) !important;
    border: none !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    width: 62px !important;
    display: block;
    cursor: pointer;
    border: none;
    text-decoration: none;
    top: 11px !important;
}
.jw-map-slider .ui-slider-handle:focus {
    outline: 0
}
.jw-map-slider .ui-slider-handle span {
    display: block;
    width: 52px;
    padding: 5px;
    background-color: #fff;
    color: #222;
    margin-top: 14px;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    text-shadow: none;
}
.jw-map-slider .ui-tabs.ui-widget-content {
    background-image: none;
    background-color: #fff;
}
/* Animation Controls */

/* Map Controls */
#get-pro-stations-ctn {
    position: absolute;
    left: 66px;
    top: 4px;
    z-index: 50;
    background-color: #fff;
}

#get-pro-stations {
    display: block;
}

.jw-map-save.ui-state-default {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  position: absolute;
  top: 17px;
  left: 66px;
  z-index: 50;
  border: 1px solid #528906;
  background: #9dd53a;
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzlkZDUzYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2ExZDU0ZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iIzgwYzIxNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3Y2JjMGEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top, #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9dd53a), color-stop(50%,#a1d54f), color-stop(51%,#80c217), color-stop(100%,#7cbc0a));
  background: -webkit-linear-gradient(top, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
  background: -o-linear-gradient(top, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
  background: -ms-linear-gradient(top, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
  background: linear-gradient(to bottom, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#7cbc0a',GradientType=0 );
  text-shadow: 0px 1px 0px rgba(114, 168, 97, 1);
  -webkit-transition: 500ms ease;
  -moz-transition: 500ms ease;
  -o-transition: 500ms ease;
  transition: 500ms ease;
}

.expanded-left.map-page .jw-map-save,
.expanded-left.map-page #get-pro-stations-ctn {
  left: 303px;
}

.jw-map-zoom-control {
    position: absolute;
    top: 10px;
    left: 8px;
    border: none;
    background: none;    
}

.jw-map-zoom-in, .jw-map-zoom-out {
    width: 24px;
    height: 24px;
    margin-bottom: 5px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.jw-map-zoom-in {
    background: #000 url(images/map-plus.png) 50% 50% no-repeat !important;    
}

.jw-map-zoom-out {    
    background: #000 url(images/map-minus.png) 50% 50% no-repeat !important;    
}

.map-page .jw-map-zoom-control {
    left: 5px;    
    top: 50px;
}

.jw-map-timestamp {
    position: absolute;
    padding: 3px 12px;
    top: 10px;
    left:45px;   
    min-width: 128px;
}

.map-page .jw-map-timestamp {
    top: 50px;
    left: 66px;
    background: #000;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.jw-map-timestamp.dropdown {
    cursor: pointer;
    padding-right: 25px;   
}

.jw-map-timestamp.dropdown .jw-timesteps-icon {
    display: block !important;
}

/* FX Time Selector */
.jw-map-timestamp.dropdown-fx ul {
    width: 220px;
}

.jw-timesteps-icon {
    position: absolute;
    right: 8px;
    top: 50%;
    width: 0px;
    height: 0px;
    border-top: 5px solid #fff; 
    border-left: 5px solid rgba(0, 0, 0, 0);
    border-right: 5px solid rgba(0, 0, 0, 0);
    background: none;
    margin-top: -4px;
}
/* FX Time Selector */

.jw-map-buttons {
    position: absolute;
    top: 8px;
    right: 8px;
}

.fullwidth .jw-map-buttons {
    right: 50%;
    top: 50px;
    margin-right: -475px;
}

/* Map Controls */

/* Surface Currents */
.surface-currents-not-available, .flowviz-not-available {
    position: absolute;
    width: 500px;
    top: 45%;
    left: 50%;
    margin-left: -250px;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    color: #fff;    
}

.map-bg-map .surface-currents-not-available, .map-bg-terrain .surface-currents-not-available, .map-bg-map .flowviz-not-available, .map-bg-terrain .flowviz-not-available {
    color: #222;
}
/* Surface Currents */

/* Bulletins - Map */
.spotInfoContainer .jw-map .jw-bulletin-ctn {
    position: absolute;
    z-index: 500;
    bottom: 0;
    right: 0;
    width: 350px;
    height: 400px;
}
.spotInfoContainer .jw-map .jw-bulletin-close-ctn {    
    top: -10px;
    left: -10px;    
}
.spotInfoContainer .jw-map .jw-bulletin-ctn .ui-tabs-nav {
    min-width: 340px
}
.spotInfoContainer .jw-map .jw-bulletin-ctn .viewport {    
    height: 300px;
    overflow: auto;
    position: relative;
}
.spotInfoContainer .jw-map .jw-bulletin-ctn .overview {
    list-style: none;
    position: absolute;
    left: 0;
    top: 0;
}
.spotInfoContainer .jw-map .jw-bulletin-ctn .scrollbar {
    margin-right: 0
}
.spotInfoContainer .jw-bulletin-ctn p,
.spotInfoContainer .jw-bulletin-ctn pre {
    color: #222;
    text-shadow: none;
    font-size: 12px;
}
.jw-bulletin-ctn .jw-bulletin-favorite {
    float: right
}
.jw-bulletin-ctn .ui-tabs-panel {
    padding-right: 0;
}
.jw-bulletin-ww-count {position: absolute; background-color: #FCEFA1; color: #222; top: -3px; right: -10px; width: 16px; height: 15px; text-align: center; font-size: 11px; font-weight: bold; padding-top: 1px;
-webkit-box-shadow: 0 2px 4px rgba(68, 68, 68, 0.8), 0 2px rgba(255, 255, 255, 0.3) inset;
-moz-box-shadow: 0 2px 4px rgba(68, 68, 68, 0.8), 0 2px rgba(255, 255, 255, 0.3) inset;
box-shadow: 0 2px 4px rgba(68, 68, 68, 0.8), 0 2px rgba(255, 255, 255, 0.3) inset;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
-ms-border-radius: 12px;
-o-border-radius: 12px;
border-radius: 12px;
}
/* Bulletins - Map */

/* Bulletins - Spot Detail Page */
#bulletin.containerWrapper .jw-bulletin-close-ctn {
    display: none;
}
/* Bulletins - Spot Detail Page */

/* Profile Tree */
.jw-section-content select.jw-profile-selector {
    width: 157px;
    vertical-align: middle;
}

.jw-map-profile-new-window {
    display: inline-block;
    vertical-align: middle;    
}

.jw-map-create-folder {
    display: inline-block;
    background-image: none;
    background-color: transparent;
    border: none;    
    width: 20px !important;
    height: 20px !important;
}

.jw-map-create-folder span.ui-icon {
    background-image: url(../jQuery/themes/pro-ui/images/ui-icons_cd0a0a_256x240.png);
}

.jw-map-profile-tree-node-ctrls {
    display: inline-block;
    cursor: pointer;
}
/* Profile Tree */

/* Customize Section */
.jw-map-customize-tabs, .jw-map-customize-tabs .ui-tabs-nav {
    padding: 0;
}

.jw-map-customize-tabs.ui-tabs .ui-tabs-nav li a {
    padding: .5em .8em;
}

.animated{-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:1.5s;-moz-animation-duration:1.5s;-ms-animation-duration:1.5s;-o-animation-duration:1.5s;animation-duration:1.5s;}.animated.hinge{-webkit-animation-duration:1.5s;-moz-animation-duration:1.5s;-ms-animation-duration:1.5s;-o-animation-duration:1.5s;animation-duration:1.5s;}@-webkit-keyframes tada {
	0% {-webkit-transform: scale(1);}	10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);}
	30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);}
	40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);}
	100% {-webkit-transform: scale(1) rotate(0);}
}

@-moz-keyframes tada {
	0% {-moz-transform: scale(1);}	
	10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);}
	30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);}
	40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);}
	100% {-moz-transform: scale(1) rotate(0);}
}

@-o-keyframes tada {
	0% {-o-transform: scale(1);}	
	10%, 20% {-o-transform: scale(0.9) rotate(-3deg);}
	30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);}
	40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);}
	100% {-o-transform: scale(1) rotate(0);}
}

@keyframes tada {
	0% {transform: scale(1);}	
	10%, 20% {transform: scale(0.9) rotate(-3deg);}
	30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);}
	40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);}
	100% {transform: scale(1) rotate(0);}
}

.tada {
	-webkit-animation-name: tada;
	-moz-animation-name: tada;
	-o-animation-name: tada;
	animation-name: tada;
}

.unsaved-map {
    margin: 10px 0;
    padding: 5px;
    border: 1px dashed #99DEFD;
    background-color: #D8F0FA;
    position: relative;
    min-height: 27px;
    vertical-align:middle
}

.unsaved-map a:hover {
    text-decoration: none;
}

.unsaved-map button {
    position: absolute;
    right: 5px;
}

.jw-map-unsaved-title {
    padding: 0 5px;
    line-height: 26px;
    display: inline-block;
    vertical-align: middle;    
    font-weight: bold;
}
.jw-map-unsaved-title {
    *display: inline
} /* IE7 hack */

.local-profile-warning {
    border: 1px solid #FBB917;
    background-color: #FFF380;
    padding: 8px;
    margin: 5px 0 8px;
}

/***** jweather_map *****/

/*WEATHER ARROWS*/
.windarrow {
    background-image: url(http://i.windalert.com/sprites-windarrows.png);
    background-repeat: no-repeat;
    height: 12px;
    width: 12px;
}
.windarrow-0 {
    background-position: -128px -1280px
}
.windarrow-1 {
    background-position: 0 0
}
.windarrow-10 {
    background-position: 0 -32px
}
.windarrow-100 {
    background-position: 0 -64px
}
.windarrow-101 {
    background-position: 0 -96px
}
.windarrow-102 {
    background-position: 0 -128px
}
.windarrow-103 {
    background-position: 0 -160px
}
.windarrow-104 {
    background-position: 0 -192px
}
.windarrow-105 {
    background-position: 0 -224px
}
.windarrow-106 {
    background-position: 0 -256px
}
.windarrow-107 {
    background-position: 0 -288px
}
.windarrow-108 {
    background-position: 0 -320px
}
.windarrow-109 {
    background-position: 0 -352px
}
.windarrow-11 {
    background-position: 0 -384px
}
.windarrow-110 {
    background-position: 0 -416px
}
.windarrow-111 {
    background-position: 0 -448px
}
.windarrow-112 {
    background-position: 0 -480px
}
.windarrow-113 {
    background-position: 0 -512px
}
.windarrow-114 {
    background-position: 0 -544px
}
.windarrow-115 {
    background-position: 0 -576px
}
.windarrow-116 {
    background-position: 0 -608px
}
.windarrow-117 {
    background-position: 0 -640px
}
.windarrow-118 {
    background-position: 0 -672px
}
.windarrow-119 {
    background-position: 0 -704px
}
.windarrow-12 {
    background-position: 0 -736px
}
.windarrow-120 {
    background-position: 0 -768px
}
.windarrow-121 {
    background-position: 0 -800px
}
.windarrow-122 {
    background-position: 0 -832px
}
.windarrow-123 {
    background-position: 0 -864px
}
.windarrow-124 {
    background-position: 0 -896px
}
.windarrow-125 {
    background-position: 0 -928px
}
.windarrow-126 {
    background-position: 0 -960px
}
.windarrow-127 {
    background-position: 0 -992px
}
.windarrow-128 {
    background-position: 0 -1024px
}
.windarrow-129 {
    background-position: 0 -1056px
}
.windarrow-13 {
    background-position: 0 -1088px
}
.windarrow-130 {
    background-position: 0 -1120px
}
.windarrow-131 {
    background-position: 0 -1152px
}
.windarrow-132 {
    background-position: 0 -1184px
}
.windarrow-133 {
    background-position: 0 -1216px
}
.windarrow-134 {
    background-position: 0 -1248px
}
.windarrow-135 {
    background-position: 0 -1280px
}
.windarrow-136 {
    background-position: 0 -1312px
}
.windarrow-137 {
    background-position: 0 -1344px
}
.windarrow-138 {
    background-position: 0 -1376px
}
.windarrow-139 {
    background-position: 0 -1408px
}
.windarrow-14 {
    background-position: 0 -1440px
}
.windarrow-140 {
    background-position: 0 -1472px
}
.windarrow-141 {
    background-position: 0 -1504px
}
.windarrow-142 {
    background-position: 0 -1536px
}
.windarrow-143 {
    background-position: 0 -1568px
}
.windarrow-144 {
    background-position: 0 -1600px
}
.windarrow-145 {
    background-position: 0 -1632px
}
.windarrow-146 {
    background-position: 0 -1664px
}
.windarrow-147 {
    background-position: 0 -1696px
}
.windarrow-148 {
    background-position: 0 -1728px
}
.windarrow-149 {
    background-position: 0 -1760px
}
.windarrow-15 {
    background-position: 0 -1792px
}
.windarrow-150 {
    background-position: 0 -1824px
}
.windarrow-151 {
    background-position: 0 -1856px
}
.windarrow-152 {
    background-position: 0 -1888px
}
.windarrow-153 {
    background-position: 0 -1920px
}
.windarrow-154 {
    background-position: 0 -1952px
}
.windarrow-155 {
    background-position: -32px 0
}
.windarrow-156 {
    background-position: -32px -32px
}
.windarrow-157 {
    background-position: -32px -64px
}
.windarrow-158 {
    background-position: -32px -96px
}
.windarrow-159 {
    background-position: -32px -128px
}
.windarrow-16 {
    background-position: -32px -160px
}
.windarrow-160 {
    background-position: -32px -192px
}
.windarrow-161 {
    background-position: -32px -224px
}
.windarrow-162 {
    background-position: -32px -256px
}
.windarrow-163 {
    background-position: -32px -288px
}
.windarrow-164 {
    background-position: -32px -320px
}
.windarrow-165 {
    background-position: -32px -352px
}
.windarrow-166 {
    background-position: -32px -384px
}
.windarrow-167 {
    background-position: -32px -416px
}
.windarrow-168 {
    background-position: -32px -448px
}
.windarrow-169 {
    background-position: -32px -480px
}
.windarrow-17 {
    background-position: -32px -512px
}
.windarrow-170 {
    background-position: -32px -544px
}
.windarrow-171 {
    background-position: -32px -576px
}
.windarrow-172 {
    background-position: -32px -608px
}
.windarrow-173 {
    background-position: -32px -640px
}
.windarrow-174 {
    background-position: -32px -672px
}
.windarrow-175 {
    background-position: -32px -704px
}
.windarrow-176 {
    background-position: -32px -736px
}
.windarrow-177 {
    background-position: -32px -768px
}
.windarrow-178 {
    background-position: -32px -800px
}
.windarrow-179 {
    background-position: -32px -832px
}
.windarrow-18 {
    background-position: -32px -864px
}
.windarrow-180 {
    background-position: -32px -896px
}
.windarrow-181 {
    background-position: -32px -928px
}
.windarrow-182 {
    background-position: -32px -960px
}
.windarrow-183 {
    background-position: -32px -992px
}
.windarrow-184 {
    background-position: -32px -1024px
}
.windarrow-185 {
    background-position: -32px -1056px
}
.windarrow-186 {
    background-position: -32px -1088px
}
.windarrow-187 {
    background-position: -32px -1120px
}
.windarrow-188 {
    background-position: -32px -1152px
}
.windarrow-189 {
    background-position: -32px -1184px
}
.windarrow-19 {
    background-position: -32px -1216px
}
.windarrow-190 {
    background-position: -32px -1248px
}
.windarrow-191 {
    background-position: -32px -1280px
}
.windarrow-192 {
    background-position: -32px -1312px
}
.windarrow-193 {
    background-position: -32px -1344px
}
.windarrow-194 {
    background-position: -32px -1376px
}
.windarrow-195 {
    background-position: -32px -1408px
}
.windarrow-196 {
    background-position: -32px -1440px
}
.windarrow-197 {
    background-position: -32px -1472px
}
.windarrow-198 {
    background-position: -32px -1504px
}
.windarrow-199 {
    background-position: -32px -1536px
}
.windarrow-2 {
    background-position: -32px -1568px
}
.windarrow-20 {
    background-position: -32px -1600px
}
.windarrow-200 {
    background-position: -32px -1632px
}
.windarrow-201 {
    background-position: -32px -1664px
}
.windarrow-202 {
    background-position: -32px -1696px
}
.windarrow-203 {
    background-position: -32px -1728px
}
.windarrow-204 {
    background-position: -32px -1760px
}
.windarrow-205 {
    background-position: -32px -1792px
}
.windarrow-206 {
    background-position: -32px -1824px
}
.windarrow-207 {
    background-position: -32px -1856px
}
.windarrow-208 {
    background-position: -32px -1888px
}
.windarrow-209 {
    background-position: -32px -1920px
}
.windarrow-21 {
    background-position: -32px -1952px
}
.windarrow-210 {
    background-position: -64px 0
}
.windarrow-211 {
    background-position: -64px -32px
}
.windarrow-212 {
    background-position: -64px -64px
}
.windarrow-213 {
    background-position: -64px -96px
}
.windarrow-214 {
    background-position: -64px -128px
}
.windarrow-215 {
    background-position: -64px -160px
}
.windarrow-216 {
    background-position: -64px -192px
}
.windarrow-217 {
    background-position: -64px -224px
}
.windarrow-218 {
    background-position: -64px -256px
}
.windarrow-219 {
    background-position: -64px -288px
}
.windarrow-22 {
    background-position: -64px -320px
}
.windarrow-220 {
    background-position: -64px -352px
}
.windarrow-221 {
    background-position: -64px -384px
}
.windarrow-222 {
    background-position: -64px -416px
}
.windarrow-223 {
    background-position: -64px -448px
}
.windarrow-224 {
    background-position: -64px -480px
}
.windarrow-225 {
    background-position: -64px -512px
}
.windarrow-226 {
    background-position: -64px -544px
}
.windarrow-227 {
    background-position: -64px -576px
}
.windarrow-228 {
    background-position: -64px -608px
}
.windarrow-229 {
    background-position: -64px -640px
}
.windarrow-23 {
    background-position: -64px -672px
}
.windarrow-230 {
    background-position: -64px -704px
}
.windarrow-231 {
    background-position: -64px -736px
}
.windarrow-232 {
    background-position: -64px -768px
}
.windarrow-233 {
    background-position: -64px -800px
}
.windarrow-234 {
    background-position: -64px -832px
}
.windarrow-235 {
    background-position: -64px -864px
}
.windarrow-236 {
    background-position: -64px -896px
}
.windarrow-237 {
    background-position: -64px -928px
}
.windarrow-238 {
    background-position: -64px -960px
}
.windarrow-239 {
    background-position: -64px -992px
}
.windarrow-24 {
    background-position: -64px -1024px
}
.windarrow-240 {
    background-position: -64px -1056px
}
.windarrow-241 {
    background-position: -64px -1088px
}
.windarrow-242 {
    background-position: -64px -1120px
}
.windarrow-243 {
    background-position: -64px -1152px
}
.windarrow-244 {
    background-position: -64px -1184px
}
.windarrow-245 {
    background-position: -64px -1216px
}
.windarrow-246 {
    background-position: -64px -1248px
}
.windarrow-247 {
    background-position: -64px -1280px
}
.windarrow-248 {
    background-position: -64px -1312px
}
.windarrow-249 {
    background-position: -64px -1344px
}
.windarrow-25 {
    background-position: -64px -1376px
}
.windarrow-250 {
    background-position: -64px -1408px
}
.windarrow-251 {
    background-position: -64px -1440px
}
.windarrow-252 {
    background-position: -64px -1472px
}
.windarrow-253 {
    background-position: -64px -1504px
}
.windarrow-254 {
    background-position: -64px -1536px
}
.windarrow-255 {
    background-position: -64px -1568px
}
.windarrow-256 {
    background-position: -64px -1600px
}
.windarrow-257 {
    background-position: -64px -1632px
}
.windarrow-258 {
    background-position: -64px -1664px
}
.windarrow-259 {
    background-position: -64px -1696px
}
.windarrow-26 {
    background-position: -64px -1728px
}
.windarrow-260 {
    background-position: -64px -1760px
}
.windarrow-261 {
    background-position: -64px -1792px
}
.windarrow-262 {
    background-position: -64px -1824px
}
.windarrow-263 {
    background-position: -64px -1856px
}
.windarrow-264 {
    background-position: -64px -1888px
}
.windarrow-265 {
    background-position: -64px -1920px
}
.windarrow-266 {
    background-position: -64px -1952px
}
.windarrow-267 {
    background-position: -96px 0
}
.windarrow-268 {
    background-position: -96px -32px
}
.windarrow-269 {
    background-position: -96px -64px
}
.windarrow-27 {
    background-position: -96px -96px
}
.windarrow-270 {
    background-position: -96px -128px
}
.windarrow-271 {
    background-position: -96px -160px
}
.windarrow-272 {
    background-position: -96px -192px
}
.windarrow-273 {
    background-position: -96px -224px
}
.windarrow-274 {
    background-position: -96px -256px
}
.windarrow-275 {
    background-position: -96px -288px
}
.windarrow-276 {
    background-position: -96px -320px
}
.windarrow-277 {
    background-position: -96px -352px
}
.windarrow-278 {
    background-position: -96px -384px
}
.windarrow-279 {
    background-position: -96px -416px
}
.windarrow-28 {
    background-position: -96px -448px
}
.windarrow-280 {
    background-position: -96px -480px
}
.windarrow-281 {
    background-position: -96px -512px
}
.windarrow-282 {
    background-position: -96px -544px
}
.windarrow-283 {
    background-position: -96px -576px
}
.windarrow-284 {
    background-position: -96px -608px
}
.windarrow-285 {
    background-position: -96px -640px
}
.windarrow-286 {
    background-position: -96px -672px
}
.windarrow-287 {
    background-position: -96px -704px
}
.windarrow-288 {
    background-position: -96px -736px
}
.windarrow-289 {
    background-position: -96px -768px
}
.windarrow-29 {
    background-position: -96px -800px
}
.windarrow-290 {
    background-position: -96px -832px
}
.windarrow-291 {
    background-position: -96px -864px
}
.windarrow-292 {
    background-position: -96px -896px
}
.windarrow-293 {
    background-position: -96px -928px
}
.windarrow-294 {
    background-position: -96px -960px
}
.windarrow-295 {
    background-position: -96px -992px
}
.windarrow-296 {
    background-position: -96px -1024px
}
.windarrow-297 {
    background-position: -96px -1056px
}
.windarrow-298 {
    background-position: -96px -1088px
}
.windarrow-299 {
    background-position: -96px -1120px
}
.windarrow-3 {
    background-position: -96px -1152px
}
.windarrow-30 {
    background-position: -96px -1184px
}
.windarrow-300 {
    background-position: -96px -1216px
}
.windarrow-301 {
    background-position: -96px -1248px
}
.windarrow-302 {
    background-position: -96px -1280px
}
.windarrow-303 {
    background-position: -96px -1312px
}
.windarrow-304 {
    background-position: -96px -1344px
}
.windarrow-305 {
    background-position: -96px -1376px
}
.windarrow-306 {
    background-position: -96px -1408px
}
.windarrow-307 {
    background-position: -96px -1440px
}
.windarrow-308 {
    background-position: -96px -1472px
}
.windarrow-309 {
    background-position: -96px -1504px
}
.windarrow-31 {
    background-position: -96px -1536px
}
.windarrow-310 {
    background-position: -96px -1568px
}
.windarrow-311 {
    background-position: -96px -1600px
}
.windarrow-312 {
    background-position: -96px -1632px
}
.windarrow-313 {
    background-position: -96px -1664px
}
.windarrow-314 {
    background-position: -96px -1696px
}
.windarrow-315 {
    background-position: -96px -1728px
}
.windarrow-316 {
    background-position: -96px -1760px
}
.windarrow-317 {
    background-position: -96px -1792px
}
.windarrow-318 {
    background-position: -96px -1824px
}
.windarrow-319 {
    background-position: -96px -1856px
}
.windarrow-32 {
    background-position: -96px -1888px
}
.windarrow-320 {
    background-position: -96px -1920px
}
.windarrow-321 {
    background-position: -96px -1952px
}
.windarrow-322 {
    background-position: -128px 0
}
.windarrow-323 {
    background-position: -128px -32px
}
.windarrow-324 {
    background-position: -128px -64px
}
.windarrow-325 {
    background-position: -128px -96px
}
.windarrow-326 {
    background-position: -128px -128px
}
.windarrow-327 {
    background-position: -128px -160px
}
.windarrow-328 {
    background-position: -128px -192px
}
.windarrow-329 {
    background-position: -128px -224px
}
.windarrow-33 {
    background-position: -128px -256px
}
.windarrow-330 {
    background-position: -128px -288px
}
.windarrow-331 {
    background-position: -128px -320px
}
.windarrow-332 {
    background-position: -128px -352px
}
.windarrow-333 {
    background-position: -128px -384px
}
.windarrow-334 {
    background-position: -128px -416px
}
.windarrow-335 {
    background-position: -128px -448px
}
.windarrow-336 {
    background-position: -128px -480px
}
.windarrow-337 {
    background-position: -128px -512px
}
.windarrow-338 {
    background-position: -128px -544px
}
.windarrow-339 {
    background-position: -128px -576px
}
.windarrow-34 {
    background-position: -128px -608px
}
.windarrow-340 {
    background-position: -128px -640px
}
.windarrow-341 {
    background-position: -128px -672px
}
.windarrow-342 {
    background-position: -128px -704px
}
.windarrow-343 {
    background-position: -128px -736px
}
.windarrow-344 {
    background-position: -128px -768px
}
.windarrow-345 {
    background-position: -128px -800px
}
.windarrow-346 {
    background-position: -128px -832px
}
.windarrow-347 {
    background-position: -128px -864px
}
.windarrow-348 {
    background-position: -128px -896px
}
.windarrow-349 {
    background-position: -128px -928px
}
.windarrow-35 {
    background-position: -128px -960px
}
.windarrow-350 {
    background-position: -128px -992px
}
.windarrow-351 {
    background-position: -128px -1024px
}
.windarrow-352 {
    background-position: -128px -1056px
}
.windarrow-353 {
    background-position: -128px -1088px
}
.windarrow-354 {
    background-position: -128px -1120px
}
.windarrow-355 {
    background-position: -128px -1152px
}
.windarrow-356 {
    background-position: -128px -1184px
}
.windarrow-357 {
    background-position: -128px -1216px
}
.windarrow-358 {
    background-position: -128px -1248px
}
.windarrow-359 {
    background-position: -128px -1280px
}
.windarrow-36 {
    background-position: -128px -1312px
}
.windarrow-37 {
    background-position: -128px -1344px
}
.windarrow-38 {
    background-position: -128px -1376px
}
.windarrow-39 {
    background-position: -128px -1408px
}
.windarrow-4 {
    background-position: -128px -1440px
}
.windarrow-40 {
    background-position: -128px -1472px
}
.windarrow-41 {
    background-position: -128px -1504px
}
.windarrow-42 {
    background-position: -128px -1536px
}
.windarrow-43 {
    background-position: -128px -1568px
}
.windarrow-44 {
    background-position: -128px -1600px
}
.windarrow-45 {
    background-position: -128px -1632px
}
.windarrow-46 {
    background-position: -128px -1664px
}
.windarrow-47 {
    background-position: -128px -1696px
}
.windarrow-48 {
    background-position: -128px -1728px
}
.windarrow-49 {
    background-position: -128px -1760px
}
.windarrow-5 {
    background-position: -128px -1792px
}
.windarrow-50 {
    background-position: -128px -1824px
}
.windarrow-51 {
    background-position: -128px -1856px
}
.windarrow-52 {
    background-position: -128px -1888px
}
.windarrow-53 {
    background-position: -128px -1920px
}
.windarrow-54 {
    background-position: -128px -1952px
}
.windarrow-55 {
    background-position: -160px 0
}
.windarrow-56 {
    background-position: -160px -32px
}
.windarrow-57 {
    background-position: -160px -64px
}
.windarrow-58 {
    background-position: -160px -96px
}
.windarrow-59 {
    background-position: -160px -128px
}
.windarrow-6 {
    background-position: -160px -160px
}
.windarrow-60 {
    background-position: -160px -192px
}
.windarrow-61 {
    background-position: -160px -224px
}
.windarrow-62 {
    background-position: -160px -256px
}
.windarrow-63 {
    background-position: -160px -288px
}
.windarrow-64 {
    background-position: -160px -320px
}
.windarrow-65 {
    background-position: -160px -352px
}
.windarrow-66 {
    background-position: -160px -384px
}
.windarrow-67 {
    background-position: -160px -416px
}
.windarrow-68 {
    background-position: -160px -448px
}
.windarrow-69 {
    background-position: -160px -480px
}
.windarrow-7 {
    background-position: -160px -512px
}
.windarrow-70 {
    background-position: -160px -544px
}
.windarrow-71 {
    background-position: -160px -576px
}
.windarrow-72 {
    background-position: -160px -608px
}
.windarrow-73 {
    background-position: -160px -640px
}
.windarrow-74 {
    background-position: -160px -672px
}
.windarrow-75 {
    background-position: -160px -704px
}
.windarrow-76 {
    background-position: -160px -736px
}
.windarrow-77 {
    background-position: -160px -768px
}
.windarrow-78 {
    background-position: -160px -800px
}
.windarrow-79 {
    background-position: -160px -832px
}
.windarrow-8 {
    background-position: -160px -864px
}
.windarrow-80 {
    background-position: -160px -896px
}
.windarrow-81 {
    background-position: -160px -928px
}
.windarrow-82 {
    background-position: -160px -960px
}
.windarrow-83 {
    background-position: -160px -992px
}
.windarrow-84 {
    background-position: -160px -1024px
}
.windarrow-85 {
    background-position: -160px -1056px
}
.windarrow-86 {
    background-position: -160px -1088px
}
.windarrow-87 {
    background-position: -160px -1120px
}
.windarrow-88 {
    background-position: -160px -1152px
}
.windarrow-89 {
    background-position: -160px -1184px
}
.windarrow-9 {
    background-position: -160px -1216px
}
.windarrow-90 {
    background-position: -160px -1248px
}
.windarrow-91 {
    background-position: -160px -1280px
}
.windarrow-92 {
    background-position: -160px -1312px
}
.windarrow-93 {
    background-position: -160px -1344px
}
.windarrow-94 {
    background-position: -160px -1376px
}
.windarrow-95 {
    background-position: -160px -1408px
}
.windarrow-96 {
    background-position: -160px -1440px
}
.windarrow-97 {
    background-position: -160px -1472px
}
.windarrow-98 {
    background-position: -160px -1504px
}
.windarrow-99 {
    background-position: -160px -1536px
}
/*WEATHER ARROWS*/
/*GENERAL WEATHER*/
.weather-icon {
    background-image: url(http://i.windalert.com/sprites-weather.png);
    background-repeat: no-repeat;
    margin-top: 2px;
    margin-bottom: 2px;
}
.weather-cloud1 {
    background-position: 0 0;
    width: 14px;
    height: 13px;
}
.weather-cloud2 {
    background-position: 0 -33px;
    width: 14px;
    height: 13px;
}
.weather-cloud3 {
    background-position: 0 -66px;
    width: 15px;
    height: 12px;
}
.weather-cloud4 {
    background-position: 0 -98px;
    width: 13px;
    height: 7px;
}
.weather-cloud_1_b {
    background-position: 0 -125px;
    width: 12px;
    height: 17px;
}
.weather-cloud_2_b {
    background-position: 0 -162px;
    width: 12px;
    height: 17px;
}
.weather-cloud_3_b {
    background-position: 0 -199px;
    width: 12px;
    height: 17px;
}
.weather-cloud_4_b {
    background-position: 0 -236px;
    width: 12px;
    height: 17px;
}
.weather-freezing_rain {
    background-position: 0 -273px;
    width: 13px;
    height: 15px;
}
.weather-ice_pellets {
    background-position: 0 -308px;
    width: 13px;
    height: 15px;
}
.weather-precip1 {
    background-position: 11px -343px;
    width: 10px;
    height: 30px;
}
.weather-precip2 {
    background-position: 11px -393px;
    width: 10px;
    height: 30px;
}
.weather-precip3 {
    background-position: 11px -443px;
    width: 10px;
    height: 30px;
}
.weather-precip4 {
    background-position: 11px -493px;
    width: 10px;
    height: 30px;
}
.weather-precip_0 {
    background-position: 11px -543px;
    width: 10px;
    height: 30px;
}
.weather-precip_1 {
    background-position: 11px -593px;
    width: 10px;
    height: 30px;
}
.weather-precip_2 {
    background-position: 11px -643px;
    width: 10px;
    height: 30px;
}
.weather-precip_3 {
    background-position: 11px -693px;
    width: 10px;
    height: 30px;
}
.weather-precip_4 {
    background-position: 11px -743px;
    width: 10px;
    height: 30px;
}
.weather-precip_0-small{background-position:2px -543px;width:10px;height:30px}
.weather-precip_1-small{background-position:2px -593px;width:10px;height:30px}
.weather-precip_2-small{background-position:2px -643px;width:10px;height:30px}
.weather-precip_3-small{background-position:2px -693px;width:10px;height:30px}
.weather-precip_4-small{background-position:2px -743px;width:10px;height:30px}
.weather-rain {
    background-position: 0 -793px;
    width: 13px;
    height: 15px;
}
.weather-rain_b {
    background-position: 0 -828px;
    width: 12px;
    height: 17px;
}
.weather-snow {
    background-position: 0 -865px;
    width: 13px;
    height: 15px;
}
.weather-snow_b {
    background-position: 0 -900px;
    width: 12px;
    height: 17px;
}
.weather-sun {
    background-position: 0 -937px;
    width: 12px;
    height: 12px;
}
.weather-sun_b {
    background-position: 0 -969px;
    width: 12px;
    height: 17px;
}
.weather-weather001 {
    background-position: 0 -1006px;
    width: 12px;
    height: 12px;
}
/*GENERAL WEATHER*/


/***** jweather_onsite_reports_list *****/
#onsite-reports, .containerWrapper .onsite-reports {
    background-color: #fff;
}

.onsite-list {        
    margin-right: 470px;
    background-color: #fff;
    font-size: 14px;
    max-height: 560px;
    overflow-y: auto;        
}

.onsite-list ul {
    border-right: 2px solid #ccc;
}

.onsite-list li {
    position: relative;
    display: block; 
    cursor: pointer;
    font-size: .750em;
    background-color: #ccc;
    line-height: 1.125em;    
    padding: 1.2em .25em;
    padding-left: 60px;    
    border-bottom: 1px solid #fff;
    -webkit-transition: 0.25s;
    -moz-transition: 0.25s;
    -o-transition: 0.25s;
    transition: 0.25s;  
}

.onsite-list li.onsite-list-day-hdr {
    padding-left: 10px;
    background-color: #666;
    color: #fff;
    font-weight: bold;
    font-size:.9em;
    padding: .4em;
}

#onsite-reports li.onsite-list-day-hdr {
    display: none;
}

.onsite-list li p {
    padding: 0;
}

.list-wind-desc {
    line-height: 1.25em;
}

.list-meta {
    text-align: right;
    margin-top: .313em;
    color: #837f86;
}

.list-meta span {
    margin-left: 10px;
}

.onsite-list li.selected, .onsite-list li:hover {
    background-color: #fff;
}

.onsite-list li.selected::before, .onsite-list li:hover::before {
    content: '';
    position: absolute;
    top: 5px;
    left: 1px;
    bottom: 5px;
    width: 3px;
    border-radius: 5px;
}

.onsite-list li.selected::before {
    background-color: #1B82E0;
}

.onsite-list li:hover::before {
    background-color: #8ac3f9;
}


.onsite-list li.onsite-list-day-hdr.selected, .onsite-list li.onsite-list-day-hdr:hover {
    background-color: #666;
}

.onsite-meter-link {
    padding: 15px;
    text-align: center;
    font-size: 14px;
}

.onsite-meter-link a {
    color: Blue;
    text-decoration: underline;
}

.onsite-marker {
    position: absolute;
    left: 5px;
    top: 50%;
    margin-top: -17.5px;
}

.onsite-detail {
    float: right;
    width: 470px;
    height: 100%;
    background-color: #fff;
    color: #222;
}

.detail-content {
    padding: 0 10px 15px 20px;
}

.meta {    
    width: 410px; 
    padding: 4px;
    background-color: #eee;
    border-top: 1px solid #ccc;
}

.onsite-report-ctn:after, .wind-desc:after, .meta:after {
    content: "";
    display: table;
    clear: both;
}

.meta p {    
    font-size: 12px;    
}

.meta .report-type {
    float: right;
}

.reputation-ctn {
    clear:both;
    margin-top: 10px;    
}

.detail-content .reputation-ctn .sparkbar {
    width: 200px; /* IE7 fix */
}

.report-distance {
    margin-top: 15px;
    text-align: center;
}

.show-onsite-reports {
    display: block;
    clear: both;
    background-color: #ccc;
    padding: 8px;
    width: 402px;
    margin-top: 4px;    
}

.onsite-report-map {        
    border: 1px solid #e2e2e2;    
}

.onsite-detail h1 {
    font-size: 14px;
    margin: 0 10px;
    font-weight: 900;    
    border-bottom: 1px solid #ccc;
    min-height: 40px;
    line-height: 40px;
    vertical-align: middle;
}

.shared-from {
    position: absolute;
    right: 10px;
    top: 0;        
    height: 35px;
}

.shared-from img {
    height: 100%;
    opacity: .3;
    filter: alpha(opacity=30);
    -webkit-transition: 0.25s;
    -moz-transition: 0.25s;
    -o-transition: 0.25s;
    transition: 0.25s;     
}

.shared-from img:hover {
    opacity: .5;
    filter: alpha(opacity=50);
}

.wind-desc {
    clear:both;
    font-size: 1.750em;
    line-height: 1.429em;
    text-align: center;
    padding: .938em 30px;    
    font-style: italic;        
}

.wind-desc .qstart {
     float: left;
     height: 45px;
     margin-top: -20px;
     padding-top: 45px;
     margin-bottom: -50px;
     margin-left: -49px;
     font-size: 500%;     
 }

 .wind-desc .qend {
     float: right;
     height: 25px;
     margin-top: 0px;
     margin-right: -40px;
     padding-top: 45px;
     padding-right: 10px;
     font-size: 500%;     
 }

.short-url {
    border: 1px solid #e2e2e2;
    color: #888;
    font-size: 18px;
    padding: 7px;
}

.social-btns li {
    display: inline-block;
    *display: inline; /* IE7 */
    zoom: 1;    
    vertical-align: middle;
    padding: 0 .125em;
    margin-top: 1em;
}

.social-btns a {    
    opacity: 0.8;
    filter: alpha(opacity=80);    
    -webkit-transition: 0.25s;
    -moz-transition: 0.25s;
    -o-transition: 0.25s;
    transition: 0.25s;
}

.social-btns a:hover {
    opacity: 1;
    filter: alpha(opacity=100);
}

.social-btns img {
    height: 45px;
    width: 45px;
}

.onsite-reports-no-reports {
    width: 100%;
    text-align: center;
    padding: 10px;
    font-size: 14px;
}

/***** jweather_onsite_reports_list *****/

/***** jweather_daily_briefing *****/

.jw-daily-briefing {
    padding: 15px;
    color: #222;
}

.wfDailyBriefing {
    padding: 15px;
    color: #fff;
}

.jw-daily-briefing strong, .jw-daily-briefing b {
    font-weight: 700 !important;
}

.jw-daily-briefing p, .wfDailyBriefing p {
    line-height: 1.2em;
}

.briefingHdr {
    background-color: #fff;
    border: 1px solid #222;
    padding: 10px;
    margin-bottom: 15px;
}

.out-of-season + .briefingHdr {
    margin-top: 10px;
}

.baja-msg {
    font-weight: 900;
    margin: 15px 0;
}
/*
.fxTable {
    margin-top: 20px;
    width: 100%;
    border-collapse: collapse;
    max-width: 750px;
}

.fxTable td {
    padding: 5px 0;
    text-align: center;
    color: #222;
}

.fxTable td.lightTxt {
    color: #fff
}

.fxTable tr.fxSpot td {
    border-bottom: 2px solid #222
}

.fxTable td.fxSpot,
.fxTable td.fxInt {
    font-weight: 900;
    padding: 25px 10px 2px 10px !important;
}

.fxTable td.fxSpeed,
.fxTable td.fxDir {
    border-left: 2px solid #222;
    border-right: 2px solid #222;
}

.fxTable td.fxDir {
    border-bottom: 2px solid #222;
}

.fxTable tr.fxJabber td {
    font-weight: bold;
    background-color: #ccc;
}

.fxTable .lbl {
    text-align: left;    
}*/

.jw-daily-briefing .footer {
    margin-top: 10px;
}

.forecaster-blog a {
    color: #222;
    text-decoration: underline;
}

.sampleFx img {
    max-width: 100%;
}

.extendedFx {
    margin-top: 15px;
}

.extendedFx h2 {
    font-weight: 900;
    margin: 10px 0 5px 0;
}

.fxFeedbackHdr {
    margin-top: 15px;
}

.fxFeedbackHdr a {
    text-decoration: underline;
    color: #222;
}

.fxFeedbackInput {
    margin-top: 10px;
}

.fxFeedbackInput textarea {
    width: 100%;
    height: 50px;
    margin-top: 5px;
}

.dailyFxList ul {
    list-style: disc;
    margin: 15px 0 0 25px;
    color: #fff;
}
.dailyFxList li {
    padding: 5px 0;
    display: block;
}

.ds-spot-briefing .fx-watermark, .containerWrapper .fx-watermark {
    position: absolute !important;
    top: 30% !important;
}

.out-of-season {
    padding: 8px;
    text-align: center;
    margin: 0.5rem 0.5rem 10px;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: var(--border-radius);
}

.out-of-season h3 {
    font-size: 1rem;
    font-weight: 400;
    text-align: center;
}

.jw-daily-briefing .out-of-season {
    margin: 0.5rem -7px 0;
}

.fx-watermark {
    position: absolute !important;
    top: 150px !important;
}
/***** jweather_daily_briefing *****/

/***** jweather_common *****/
:focus {    
    outline:none;
}
/* Header */
.jw-panel-left h2, .jw-map-view-header, .wfmodal-header, .jw-map-view-list h2, .ui-dialog-titlebar {
    position: relative;
    background-color: #3A3B44;
    color: #fff;
    padding: 8px;
    font-weight: bold;
    text-align: center;
    border-bottom: 3px solid #28282E;
    cursor:pointer;
}
/* Header */

/* Info windows & Modals */
.jw-map-qv-close-ctn, .onsite-qv-close-ctn, .wfmodal-close-ctn, .spotInfoContainer .jw-map .jw-bulletin-close-ctn, .ui-dialog-titlebar-close {    
    position: absolute;
    background-color: #C33;
    top: -10px !important;
    right: -10px !important;
    width: 20px !important;
    height: 20px !important;
    -webkit-box-shadow: 0 2px 4px rgba(68, 68, 68, 0.8), 0 2px rgba(255, 255, 255, 0.3) inset;
    -moz-box-shadow: 0 2px 4px rgba(68, 68, 68, 0.8), 0 2px rgba(255, 255, 255, 0.3) inset;
    box-shadow: 0 2px 4px rgba(68, 68, 68, 0.8), 0 2px rgba(255, 255, 255, 0.3) inset;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -ms-border-radius: 12px;
    -o-border-radius: 12px;
    border-radius: 12px;
    margin: 0 !important;
    padding: 0 !important;
}
.jw-map-qv-close-ctn a, .onsite-qv-close-ctn a, .wfmodal a.modal-close, .jw-bulletin-close-ctn a, .ui-dialog-titlebar-close .ui-icon-closethick {
    margin-top: 2px;
    margin-left: 2px;
    display: block;
    background-image: url(../jquery/themes/pro-ui/images/ui-icons_ffffff_256x240.png) !important;
    background-position: -96px -128px !important;
}
.jw-map-qv, .wfmodal {
    -webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
}
/* Info windows & Modals */

/* Menus */
.jw-map-button-submenu li, .jw-map-view-list ul li.jw-map-view-item, .ui-autocomplete .ui-menu-item a, .jw-map-timestamp ul li {
    padding: 5px;
    border: 1px solid transparent;
}
.jw-map-button-submenu li:hover, .jw-map-view-list ul li.selected, .jw-map-view-list ul li.jw-map-view-item:hover, .ui-menu .ui-menu-item a:hover, .ui-menu .ui-state-focus, .jw-map-timestamp ul li:hover, .jw-map-timestamp ul li.selected  {
    border: 1px solid #99DEFD;
    background-color: #D8F0FA;
}
.jw-map-button-submenu a:hover, .ui-menu .ui-menu-item a:hover, .ui-menu .ui-state-focus, .jw-map-timestamp ul a {
    text-decoration: none !important;
}
/* Menus */

/***********  Global - Main Wrapper  ***********/
.jw-main-wrapper {
    font-size: 11px;
    background-color: #ffffff;
    color: #000000;
}
/***********  Global - Controls  ***********/

.jw-controls-wrapper-row2 {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 3px;
    padding-bottom: 3px;
    border-top: 1px solid #D4D4D4;
    border-bottom: 1px solid #D4D4D4;
}

.containerWrapper {
    position: relative;
    background-color: #fff;
    overflow: hidden;
    background-image: none;
    color: #000;
    font-weight: normal;
    margin-bottom: 15px;
}

.spot-info .containerWrapper {
    min-height: 100px;
    margin-bottom: 20px;
    border-bottom: 1px solid hsla(0, 0%, 0%, .1);
}

.containerWrapper:empty {
    display: none;
}

.profile-ctn-header {
    display: flex;
    align-items: center;
    padding: 4px;
    overflow: hidden;
    background-image: none;
    color: #000;
    border-bottom: 1px solid #D4D4D4;
    background-color: #e7e7e7;
}

.profile-ctn-header .jw-sortable-grip > svg {
    width: 10px;
    fill: #444444;
}

.profile-ctn-header .ctnBtns {
    margin-left: auto;
}

.profile-ctn-header .wf-list-button{
    width: 16px;
    height: 16px;
    background:url('images/list.png') no-repeat;
}  
.profile-ctn-header .wf-map-button {
    width: 16px;
    height: 16px;
    background:url('images/globe.png') no-repeat;
} 

/*** jQuery UI Overrides */
.containerWrapper .ui-widget-content {
    border: none;
}
div.spotInfoContainer .ui-widget-content {
    border: none;
}
.ui-tabs-nav .ui-state-active {
    background-color: #fff;
    background-image: none;    
}

.ui-tabs-nav .ui-state-active a {
    color: #3A3B44;
}

.ui-dialog {
    padding: 0;
    max-width: 600px;
}

.ui-dialog-titlebar.ui-widget-header {
    border: none;
}

.ui-dialog .ui-dialog-content {
    margin-top: 8px;
}

.ui-dialog-buttonpane {
    border:none;
}

.ui-dialog-titlebar-close:hover {
    background-image: none;
    background-color: #C33;
    border: none;
}

.ui-state-error p {
    padding: 3px;
}
/*** jQuery UI Overrides */

/****     Jquery MultiSelect     ****/
a.multiSelect {
    background: url(http://i.windalert.com/downarrow-wide.png) right center no-repeat;    
    border: solid 1px #BBB;
    line-height: 25px;
    padding-right: 24px;
    position: relative;
    cursor: default;
    text-decoration: none;
    display: -moz-inline-stack;
    display: inline-block;
}
a.multiSelect:link,
a.multiSelect:visited,
a.multiSelect:active {
    color: white;
    background-color: #2B2B2B;
    cursor: pointer;
    text-decoration: none;
}
a.multiSelect:hover {
    background-color: #000
}
a.multiSelect span {
    text-align: left;
    padding-right: 5px;
    padding-left: 10px;
    display: -moz-inline-stack;
    display: inline-block;
    white-space: nowrap;
}
a.multiSelect.active,
a.multiSelect.active {
    background-image: url(http://i.windalert.com/downarrow-wide.png)
}
a.multiSelectOutbound {
    background-image: url(http://i.windalert.com/rightarrow-wide.png)
}
.multiSelectOptions {
    text-align: left;
    overflow-y: auto;
    overflow-x: hidden;
    background: #464646;
    padding: 10px;
    color: #fff;
    margin-bottom: 1px;        
}
.multiSelectOptions LABEL {
    padding: 0px 2px;
    display: block;
    white-space: nowrap;
}
.multiSelectOptions LABEL.optGroup {
    font-weight: bold
}
.multiSelectOptions .optGroupContainer LABEL {
    padding-left: 10px
}
.multiSelectOptions .optGroupHasCheckboxes .optGroupContainer LABEL {
    padding-left: 18px
}
.multiSelectOptions input {
    vertical-align: middle;
    margin-top: 5px;
    margin-bottom: 5px;
    min-width: 0px;
    min-height: 0px;
}
.multiSelectOptions LABEL {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 1px;
    margin-bottom: 1px;    
}
.multiSelectOptions LABEL.checked {
    background-color: #2B2B2B
}
.multiSelectOptions LABEL.selectAll {
    border-bottom: dotted 1px #CCC
}
.multiSelectOptions LABEL.hover {
    background-color: #2B2B2B;
    color: white;
}

/* Bulletins - Common */
.jw-bulletin-ctn .ui-widget-header .ui-state-default a {padding: 5px 10px;}
.jw-bulletin-ctn .ui-tabs-panel {margin-left: 1px; min-height: 345px; -moz-border-radius-topright:4px; -webkit-border-top-right-radius:4px;border-top-right-radius: 4px;}
.jw-bulletin-ctn .viewport {margin-top: 8px; padding: 0 10px;}
.jw-bulletin-ctn pre {color: #222; text-shadow: none; white-space: pre-wrap;       /* css-3 */
     white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
     white-space: -pre-wrap;      /* Opera 4-6 */
     white-space: -o-pre-wrap;    /* Opera 7 */
     word-wrap: break-word;       /* Internet Explorer 5.5+ */}
/* Bulletins - Common */

/* Up / Down Voting */
.reputation-ctn li {
    display: inline-block;
    *display: inline; /* IE7 */
    zoom: 1;
    padding: 0 3px;
}

.sparkbar {
    width: 125px;
    overflow:hidden;    
    background-color: #b1b1b1;
}

.sparkbar div {
    float: left;
    height: 5px;
}

.sparkbar .upvotes {
    background-color: #8ac441;
}

.sparkbar .downvotes {
    background-color: #d55454;
}

.spark-text {
    margin-top: 2px;
    font-size: 11px;    
}

.spark-text .up-vote-percent {
    float: left;
}

.spark-text .down-vote-percent {
    float: right;
}

.reputation-ctn {
    text-align: center;
}

.reputation-ctn a {
    display: block;
    height: 20px;
    width: 20px;
    background-image: url(images/up-down.png);
}

.up-vote {    
    background-position: -25px 0;
}

.up-vote:hover {
    background-position: -25px -25px;
}

.up-vote.selected {
    background-position: -25px -50px;
}

.down-vote {    
    background-position: 0 0;
}

.down-vote:hover {
    background-position: 0 -25px;
}

.down-vote.selected {
    background-position: 0 -50px;
}
/* Up / Down Voting */

.grip {
    min-height: 28px;
    width: 10px;
    margin-right: 8px;
    background-image: url(https://cdn-consumer.weatherflow.com/images/icons/grippy.gif);
    cursor: move;
}
/***** jweather_common *****/

/* JQUERY Multiselect Widget */
/*    -http://www.erichynds.com/blog/jquery-ui-multiselect-widget  */
.ui-multiselect { padding:2px 0 2px 4px; text-align:left }
.ui-multiselect span.ui-icon { float:right }
.ui-multiselect-single .ui-multiselect-checkboxes input { position:absolute !important; top: auto !important; left:-9999px; }
.ui-multiselect-single .ui-multiselect-checkboxes label { padding:5px !important }

.ui-multiselect-header { margin-bottom:3px; padding:3px 0 3px 4px }
.ui-multiselect-header ul { font-size:0.9em }
.ui-multiselect-header ul li { float:left; padding:0 10px 0 0 }
.ui-multiselect-header a { text-decoration:none }
.ui-multiselect-header a:hover { text-decoration:underline }
.ui-multiselect-header span.ui-icon { float:left }
.ui-multiselect-header li.ui-multiselect-close { float:right; text-align:right; padding-right:0 }

.ui-multiselect-menu { display:none; padding:3px; position:absolute; z-index:10000; text-align: left }
.ui-multiselect-checkboxes { position:relative /* fixes bug in IE6/7 */; overflow-y:scroll }
.ui-multiselect-checkboxes label { cursor:default; display:block; border:1px solid transparent; padding:3px 1px }
.ui-multiselect-checkboxes label input { position:relative; top:1px }
.ui-multiselect-checkboxes li { clear:both; font-size:0.9em; padding-right:3px }
.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label { text-align:center; font-weight:bold; border-bottom:1px solid }
.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a { display:block; padding:3px; margin:1px 0; text-decoration:none }

/* remove label borders in IE6 because IE6 does not support transparency */
* html .ui-multiselect-checkboxes label { border:none }

/* WeatherFlow Custom Upgrades */
.ui-multiselect-checkboxes label input { float:left; margin-right:10px; }
.ui-multiselect-checkboxes li { display:block; }
.ui-multiselect-checkboxes label input { position:relative; top:-3px; }
.ui-multiselect-header ul { font-size:10px; }
.ui-multiselect-menu { z-index:500;}
.ui-multiselect-checkboxes label { font-size:11px; }
.ui-multiselect-checkboxes label:hover {background:none; background-color:#D8F0FA; border:1px solid #99DEFD;}
.ui-multiselect-checkboxes .ui-state-hover {background: none; border:1px solid #99DEFD; color:#3A3B44;}
.ui-multiselect-checkboxes .ui-state-active {background:none; background-color:#D8F0FA; border:1px solid #99DEFD; color:#3A3B44;}
.ui-multiselect-checkboxes { overflow-y:hidden; }
/* JQUERY Multiselect Widget END */

/* WFMessage */
#userMsg {
    position: relative;
    background-color: #FFF79B;
    color: #303030;
    font-size: 13px;
}

.wfMessage {
    padding: 10px;
    margin: 0 35px 0 0;
}

.wfMessage p {
    line-height: 16px;
}

.wfMessage-close {
    position: absolute;
    background: transparent url(images/user-msg-close.png) no-repeat 50% 50%;
    height: 25px;
    width: 25px;
    top: 5px;
    right: 10px;
}

.wfMessage ul {
    float: left;
    margin-top: 0;
    margin-left: 5px;
}

.wfMessage p a {
    text-decoration: underline;
}

.wfMessage ul li {
    font-weight: 700;
    padding: 3px 8px;
    display: inline;
}
/* WFMessage */

/* Info Window */
#info-window-content p, #info-window-content li {
    line-height: 1.7em;
    margin: 8px 0;
}
#info-window-content strong {
    font-weight: 700;
}
#info-window-content h3 {
    text-decoration: underline;
    margin: 10px 0 8px;
}
/* Info Window */

.inner-page .jw-map {
    height: 600px;
    width: 100%;
    bottom: 0 !important;
}

/*.fullwidth .jw-map {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: auto;
}*/

.map-page #main-ctn {
    display: flex;
    flex-direction: column;
}

.map-page #main-content {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
}

.map-page #searchMap, .map-page #stormMap, .map-page #flowmap {
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
}

.map-page .jw-map-ctn {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.map-page .jw-map {
    bottom: 0 !important;
    flex: 1 0 auto;
}

#spot-count-txt {
    color: #222;
}

#flowmap .jw-legends {
    height: auto;
}

.jw-legends {
    background-color: #222;
    color: #fff
}

.jw-legends a {
    color: #fff;
}

.fullwidth .jw-legends {
    position: absolute;
    bottom: 0;
    left: 0;
   /* right: 0;*/
    height: 36px;
   /* z-index: 8;*/  
   text-align:center;
   width:100%;  
}

.jw-legends a {   
    text-decoration: none;
}

.jw-legends-ctn {
    margin: 0 auto;
    padding: 3px 5px;
    max-width: 950px;
}

.jw-legend-selector {
    float: left;
    margin-top: 5px;
    text-transform: capitalize;
}

.jw-legends li {
    display: inline-block;
    *display: inline; /* IE7 hack */
}

.obs-legend {
    margin: 5px auto 0;
    text-align: center;
}

.obs-legend li {
    padding: 0 5px;
}

.obs-legend li span, .pws-icon {
    display: inline-block;            
    vertical-align: middle;
    margin-top: -2px;
}

.obs-legend li span > svg {
    vertical-align: middle;
}

.obs-legend .jw-marker {
    margin-right: 8px !important;
    display: inline-block;
    *display: inline; /* IE7 hack */
}

.jw-legend-toggle {
    position: absolute;
    bottom: 0;
    z-index: 5;
    margin: 0;
    left: 50%;
    margin-left: -475px;
}

.constrained .jw-legend-toggle {
    left: 0;
    margin-left: 240px;
}

.jw-legend-close {
    float: left;
    background-image: none;
    background-color: #222;
    border: none;
    margin-right: 10px;
}

.wfcontainer-favorite{
    background-position: 0px 0;
    width: 16px;
    height: 16px;
    background-image:url('https://cdn-consumer.weatherflow.com/images/svg-icons/white/star.svg');
    background-repeat:no-repeat;
    background-size: 100% 100%;
}

/* Left Panel */
 .jw-panel-left.expanded{
    left: 0;    
}

.expanded-left .left-pnl-btn {
    left: 235px;
}

.expanded-left.map-page .jw-map-product-controls, .expanded-left.map-page .jw-map-timestamp {
    left: 303px;
}

.expanded-left.map-page .jw-map-zoom-control {
    left: 240px;
}

/* Transitions */
 .left-pnl-btn,
 .right-pnl-btn,
 .storm-pnl-btn,
 .jw-panel-left,
 .jw-panel-right,
 .jw-map-zoom-control,
 .jw-map-product-controls,
 .jw-map-timestamp,
 #get-pro-stations-ctn {    
    -webkit-transition: 500ms ease;
    -moz-transition: 500ms ease;
    -o-transition: 500ms ease;
    transition: 500ms ease;
}

.no-transition .jw-panel-right,
.no-transition .right-pnl-btn,
.no-transition .storm-pnl-btn {
    -moz-transition: none;
    -webkit-transition: none;
    -o-transition: color 0 ease-in;
    transition: none;
}

.jw-tab-ctn, .jw-tab-ctn a  {
    background-color: #222;
    color: #fff;
    font-weight:bold;
}

.jw-tab-ctn li:hover, .jw-tab-ctn li.selected, .jw-tab-ctn a:hover {
    color: #94CB68;
    cursor: pointer;
}

.non-interactive-overlay {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;    
    z-index: 50;
}

.non-interactive-map .non-interactive-overlay {
    display: block;
}

.non-interactive-map .non-interactive-overlay.ui-widget-overlay {
    opacity: .7;
    filter: Alpha(opacity=70);
}

@media only screen and (min-width: 1200px) {
    .jw-panel-right {
        position: absolute;        
        top: 0;
        bottom: 0;
        right: -800px;
        background-color: #fff;
        width: 800px;               
        z-index: 52;
    }       
    
    .jw-panel-right.expanded {
        right: 0;
    }
    
    .expanded-right-detail .right-pnl-btn, .expanded-right-detail .storm-pnl-btn,
    .expanded-right-storm .right-pnl-btn, .expanded-right-storm .storm-pnl-btn {
        right: 800px;
    }
}

@media only screen and (max-width: 1200px) {
    .jw-panel-right {
        position: absolute;        
        height: 100%;
        right: -100%;
    }
    
    .jw-panel-right.expanded {
        right: 0;
        top: 0;
        z-index: 52;
    }
    
    .expanded-right-detail .results-container,
    .expanded-right-storm .results-container {
        bottom: 0 !important;
    }
    
    .expanded-right .results-map-container,
    .expanded-right-storm .results-map-container {
        height: 100% !important;
    }
    
    .expanded-right-detail .right-pnl-btn,
    .expanded-right-storm .storm-pnl-btn {
        top: 0;
        right: 100%;
        margin-right: -50px;
        z-index: 55;
        border: none;
        background-color: transparent;
    }
    
    .jw-panel-right .jw-spot-name {
        margin-left: 55px;
    }
    
    .jw-panel-right .jw-panel-sections {
        /* padding: 10px 20px; */
    }    
}

/* Opacity Slider */
.jw-panel-left .ui-slider-horizontal {
    margin-top: 10px;
    height: .3em;
}

.jw-panel-left .ui-slider-handle {
    top: -.5em;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
/* Opacity Slider */

.jw-graph .upgrade-msg, .mcc-graph .upgrade-msg {
    position: absolute;
    width: 300px;
    top: 30%;        
    right: 65px;    
    text-align: center;
    font-weight: 900;
    font-size: 1.5em;
    z-index: 200;
}

.jw-graph {
    overflow:hidden;
}

.fake-select-wrapper #jw-fxt-model-select {
    width: 275px;
    border:none;
    background-color: transparent;
    color: #fff;
    font-weight: bold;
    border-color:transparent;  
    margin-left: 51px;  
}
.fake-select-wrapper #jw-fxt-model-select:focus {
   outline:none; 
}

.fake-select-wrapper {
    background-image:url(images/fake-select-dd-arrow.png);
    background-position:center right;
    background-repeat:no-repeat;
    background-color: #B4BDC5;
    color: #fff;
    font-weight: bold;
    width:300px;
    overflow: hidden;
    float: left;
    position: relative;
}

.fake-select-wrapper:hover {
    background-color:#9fd077;
}

option.jw-fxt-model-option {
    background:#B4BDC5;
    border:none;
}

.jw-fxt-model-select-label {
    position: absolute;
    left: 3px;
    line-height: 26px;
}

/*+++++++++++++ GRAPH MODE TOGGLE ++++++++++++*/

.ctn-buttons .ui-state-default, .ctn-specific-buttons .ui-state-default, .jw-ad-controls-wrapper .ui-state-default, .right-ctn-specific-buttons .ui-state-default, .jw-ad-selected-day-table-label .ui-state-default {
border:none;
background:#b4bdc5;
}
.ctn-buttons .ui-state-hover, .ctn-specific-buttons .ui-state-hover, .jw-ad-controls-wrapper .ui-state-hover, .right-ctn-specific-buttons .ui-state-hover, .jw-ad-selected-day-table-label .ui-state-hover {
border:none;
background: #9fd077;
}
.ctn-buttons .ui-state-active, .ctn-specific-buttons .ui-state-active, .jw-ad-controls-wrapper .ui-state-active, .right-ctn-specific-buttons .ui-state-active, .jw-ad-selected-day-table-label .ui-state-active {
	background: #2e8a06;
font-weight: bold;
color: #fff;
}
.ctn-buttons .jw-cc-zoom-btns .ui-state-active .ui-button-text, .ctn-specific-buttons .jw-cc-zoom-btns .ui-state-active .ui-button-text,.jw-ad-controls-wrapper .ui-button-text, .right-ctn-specific-buttons .ui-button-text, .jw-ad-selected-day-table-label .ui-button-text
{
    text-decoration:none;
}

/* Search Results Plus */
.search-results-title-location {
    text-transform: capitalize;
}

#flowmap {
    position: relative;
    margin: 0 0 20px 0;
}

#flowmap .jw-legends-ctn .fx-legend {
    text-align: center;
}

#live-wind-model-ctn {
    position: absolute;
    top: 10px;
    left: 50px;
    background-color: #fff;
    border-radius: var(--border-radius, 5px);
    z-index: 10;
}

#live-wind-fx-model {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;        
    max-width: 208px;
}

#live-wind-fx-model optgroup {
    background-color: transparent;
}

#live-wind-fx-model.plus-available {
    background-image: url(https://cdn-consumer.weatherflow.com/images/svg-icons/1ea5de/dropdown-arrow.svg);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    background-size: 16px 10px;
    padding: 6px 30px 6px 10px;
}

/* New Model Selection */
.jw-model-selector-ctn {
    background-color: #F0F0F0;
    padding: 8px 0 0 5px;
}

.jw-model-selector-ctn h1 {
    text-transform: uppercase;
    font-size: .75em;
    padding: 0 0 8px 8px;
    color: #666;
}

.jw-model-selector {
    display: grid;
    grid-gap: 10px;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    overflow-x: scroll;
    scroll-snap-type: x proximity;
    padding-bottom: 15px;
}

.jw-model-selector .jw-model-selector-fixed-ctn {
    /*position: sticky;*/
    /*align-self: start;*/
    top: 0;
    left: 0;
    padding: 0 15px 0 0;
    border-right: 1px solid #999;
    background-color: #F0F0F0;
}

.jw-model-selector a {
    scroll-snap-align: center;
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 15px;
    background-color: #D8D8D8;
    text-decoration: none;
    color: #666;
    font-size: .875em;
    filter: drop-shadow(1px 1px 1px #999); /*- Causes weird scrolling with sticky first item */
}

.jw-model-selector a.premium {
    background-image: url(https://cdn-consumer.weatherflow.com/images/svg-icons/gray/premium.svg);
    background-repeat: no-repeat;
    background-position: 10px 50%;
    background-size: auto 20px;
    padding-left: 36px;
}

.jw-model-selector a.selected {
    background-color: #1B82E0;
    color: #fff;
}

.jw-model-selector a.selected.premium {
    background-image: url(https://cdn-consumer.weatherflow.com/images/svg-icons/white/premium.svg);
}

.jw-model-selector::-webkit-scrollbar {
    height: 5px;
}

/* Track */
.jw-model-selector-ctn::-webkit-scrollbar-track {
    background: #F0F0F0;
}

/* Handle */
.jw-model-selector::-webkit-scrollbar-thumb {
    background: #888;
}


/* FF Only: Fix FF Mac Model Switching Height Issue 8*/
@-moz-document url-prefix() { 
    #live-wind-free-model {
        line-height: 15.5px;
    }
    
    #live-wind-fx-model optgroup {
        color: #000;
    }
}

@media only screen and (max-width: 768px) {
    li.onsite-report-item {
        background-color: #fff !important;
        border-bottom: 1px solid #ccc;
    }
}

@media only screen and (max-width: 767px) {
    .ui-dialog {
        height: 100%;
        max-width: 600px;
    }
    
    .spot-info #page-title-ctn {
        float: none;
        color: #fff;
        margin: 0 0 3px 0;
        line-height: 0;        
    }    
    
    .spot-info #page-title-ctn h1 {
        display: none;
    }
    
    .spot-info #return-to-previous {
        color: #fff;
        font-size: 16px;
        background-position: 5px 50%;
        width: 100%;
        background: transparent url(https://cdn-consumer.weatherflow.com/images/svg-icons/white/arrow-left.svg) no-repeat 10px 50%;
        line-height: 37px;
        padding: 0 0 0 40px;
        background-size: 30px 30px;
        text-decoration: none;
        box-sizing: border-box;
    }
    
    .spot-info #page-title-ctn #return-to-previous:before {
        content: "Back";
    }
    
    .spot-info input, .spot-info select, .favorites input, .favorites select {
        font-size: 16px;
    }
    
    /* Current Conditions */    
    /*.jw-cc-data-ctn {
        width: 100% !important;
        float: none !important;
    }
    
    .jw-graph {
        margin: 20px 0 0 0 !important;
        width: 100% !important;
        float: none;
    }
    
    .jw-graph .upgrade-msg {
        position: relative;
        top: 200px;
        left: 50%;
        margin-left: -150px;
    }
    
    #current-conditions .ctn-specific-buttons {
        display: none !important;
    }
    
    #current-conditions .jw-ctn-graph-toggle {
        display: none !important;
    }*/
    
 /*   .spot-info .jw-spot-list ul li.spot-row {
        border: none;
        background-image: none;
        margin: 0;
        padding: 10px 0 10px 0;
        font-size: 15px;
    }*/

    
    /* Forecast Table */
    .jw-fxt-controls-advanced {
        width: 100%;
    }
    
    .fake-select-wrapper {
        float: none;
        margin: 15px auto;
    }
    
    .jw-fxt-zoom-btns, .jw-fxt-daily-btns, .jw-fxt-7day-btns {
        margin-left: 0 !important;
    }
    
    .jw-fxt-zoom-btns {
        float: none !important;
    }
    
    .jw-fxt-table-premium-label {
        text-align: left !important;
        padding-left: 5px;
    }
    
    /* Onsite Reports */
    .onsite-list {
        margin-right: 0;
        max-height: none;
    }
    
    .onsite-detail {
        display: none;
    }


    .spotinfo-advertising {
        height: auto;
    }

    .spotinfo-advertising .visible-phone {
        margin: 0 auto;
    }

    /* Map */
    .right-pnl-btn, .jw-map-save, .jw-map-zoom-in, .jw-map-zoom-out {
        display: none;
    }
    
    .map-page .jw-map-timestamp {
        top: 5px;
        right: 10px;
        left: auto;
    }
    
    #get-pro-stations-ctn {
        right: 10px;
        left: auto;
        top: 35px;
    }
    
    .expanded-left.map-page #get-pro-stations-ctn {
        left: auto;
    }
    
    .expanded-left .jw-panel-left, .expanded-left .jw-panel-content {
        width: 100%;
    }
    
    .jw-panel-left .jw-panel-content {
        overflow-x auto !important;
        overflow-y: scroll !important;
        -webkit-overflow-scrolling: touch;
    }

    .jw-panel-left .jw-section-content {
        display: block !important;
        height: auto !important;
    }

    
    .jw-panel-sections, .jw-section-content {
        transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
    }
    
    .jw-panel-left input, .jw-panel-left select {
        font-size: 16px;
    }
    
    .jw-map-button-submenu li:hover, .jw-map-view-list ul li.jw-map-view-item:hover, .ui-menu .ui-menu-item a:hover, .jw-map-timestamp ul li:hover, .jw-map-timestamp ul li.selected  {
        border: none;
        background-color: #fff;
    }
    
    .expanded-left .jw-panel-left {
        top: 40px;
    }
    
    .expanded-left .left-pnl-btn {
        top: 0;
        left: 0;
        right: 0;
        height: 40px;
        width: 100%;
        background-image: url(images/rp-close.png);
        background-position: 98% 50%;
    }       
    
    .jw-legend-close, .jw-legends select {
        display: none !important;
    }
    
    .jw-mobile-toggle {
        display: block !important;
        margin: 5px auto 0;
        border: 1px solid #fff;
        color: #fff;
        padding: 8px 12px;
        opacity: .5;
        background-color: transparent;
    }
    
    .mobile-show-legend .jw-mobile-toggle {
        margin: 5px auto 10px;
    }
    
    .jw-legends {
        height: 45px;
        overflow: hidden;
    }
    
    .mobile-show-legend .jw-legends {
        height: auto;
        z-index: 9999;
    }
    
    .mobile-show-legend .jw-legends ul {
        margin-top: 0;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
    }
    
    .map-page .jw-map-product-controls {
        top: 30px;
        left: auto;
        right: 10px;
        width: auto;
        border-radius: 100vw;
    }
    
    .jw-map-product-controls a {
        width: 40px;
        height: 40px;
        background-size: 25px 25px;
    }
    
    .jw-map-product-controls a.ui-icon-carat-1-w {
        background-image: url(https://cdn-consumer.weatherflow.com/images/svg-icons/white/previous.svg);        
        background-position: 0 50%;
    }
    
    .jw-map-product-controls a.ui-icon-play {
        background-image: url(https://cdn-consumer.weatherflow.com/images/svg-icons/white/play.svg);
        background-position: 80% 50%;
    }
    
    .jw-map-product-controls a.ui-icon-pause {
        background-image: url(https://cdn-consumer.weatherflow.com/images/svg-icons/white/pause.svg);
        background-position: 50% 50%;
    }
    
    .jw-map-product-controls a.ui-icon-carat-1-e {
        background-image: url(https://cdn-consumer.weatherflow.com/images/svg-icons/white/next.svg);
        background-position: 100% 50%;
    }
    
    .jw-map-slider {
        display: none !important;
    }
    
    .jw-map-timestamp ul {
        left: auto;
        right: 0;
    }
    
    /* Storm Map */
    
    
    .jw-panel-right .storm-advisory {
        padding: 15px 20px 120px 15px;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
    }
    
    body.expanded-left .storm-pnl-btn {
        display: none;
    }
    
    /* Favorites */
    .jw-spot-list .grip {
        display: none;
    }
    
    /* Wind List */
    #flowmap {
        margin: 0;
    }
           
    #flowmap .jw-mobile-toggle {
        display: none !important;
    }
    
    #flowmap .fx-legend {
        margin-top: 0;
        overflow: scroll;
        -webkit-overflow-scrolling: touch;
    }
    
    .livewind #wind-list-title, .livewind #wind-list-station-title {
        display: none;
    }
    
    #live-wind-model-ctn {
        left: 5px;
    }
    
    .live-wind-model-toggle {
        padding: 10px;
    }
    
    #live-wind-fx-model.plus-available {
        padding: 10px 30px 10px 10px;
    }
}

@media only screen
    and (max-width: 767px)
    and (max-device-height: 1023px) {
    #flowmap .jw-map {
        height: 410px;
    }
}

@media only screen
    and (max-width: 767px)
    and (max-device-height: 735px) {
    #flowmap .jw-map {
        height: 350px;
    }
}

@media only screen
    and (max-width: 767px)
    and (max-device-height: 639px) {
    #flowmap .jw-map {
        height: 280px;
    }
}

@media only screen and (max-width: 375px) {
    #live-wind-fx-model {
        max-width: 200px;
    }
}

@media only screen and (max-width: 360px) {
    #live-wind-fx-model {
        max-width: 185px;
    }
}

@media only screen and (max-width: 320px) {
    #live-wind-fx-model {
        max-width: 145px;
    }
}
