﻿        @font-face {
            font-family: 'weather';
            src: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.eot');
            src: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.eot?#iefix') format('embedded-opentype'),
                 url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.woff') format('woff'),
                 url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.ttf') format('truetype'),
                 url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.svg#artill_clean_weather_iconsRg') format('svg');
            font-weight: normal;
            font-style: normal;
        }

        .icon-0:before { content: ":"; }
        .icon-1:before { content: "p"; }
        .icon-2:before { content: "S"; }
        .icon-3:before { content: "Q"; }
        .icon-4:before { content: "S"; }
        .icon-5:before { content: "W"; }
        .icon-6:before { content: "W"; }
        .icon-7:before { content: "W"; }
        .icon-8:before { content: "W"; }
        .icon-9:before { content: "I"; }
        .icon-10:before { content: "W"; }
        .icon-11:before { content: "I"; }
        .icon-12:before { content: "I"; }
        .icon-13:before { content: "I"; }
        .icon-14:before { content: "I"; }
        .icon-15:before { content: "W"; }
        .icon-16:before { content: "I"; }
        .icon-17:before { content: "W"; }
        .icon-18:before { content: "U"; }
        .icon-19:before { content: "Z"; }
        .icon-20:before { content: "Z"; }
        .icon-21:before { content: "Z"; }
        .icon-22:before { content: "Z"; }
        .icon-23:before { content: "Z"; }
        .icon-24:before { content: "E"; }
        .icon-25:before { content: "E"; }
        .icon-26:before { content: "3"; }
        .icon-27:before { content: "a"; }
        .icon-28:before { content: "A"; }
        .icon-29:before { content: "a"; }
        .icon-30:before { content: "A"; }
        .icon-31:before { content: "6"; }
        .icon-32:before { content: "1"; }
        .icon-33:before { content: "6"; }
        .icon-34:before { content: "1"; }
        .icon-35:before { content: "W"; }
        .icon-36:before { content: "1"; }
        .icon-37:before { content: "S"; }
        .icon-38:before { content: "S"; }
        .icon-39:before { content: "S"; }
        .icon-40:before { content: "M"; }
        .icon-41:before { content: "W"; }
        .icon-42:before { content: "I"; }
        .icon-43:before { content: "W"; }
        .icon-44:before { content: "a"; }
        .icon-45:before { content: "S"; }
        .icon-46:before { content: "U"; }
        .icon-47:before { content: "S"; }

.weather i {
    color: #fff;
    font-family: weather;
    font-size: 40px;
    font-weight: normal;
    font-style: normal;
    line-height: 0.9;
    text-transform: none;
}

.weather .iconw2 {
    color: #fff;
    font-size: 30px;
    text-transform: none;
}

.weather {
    font: 12px 'Open Sans', "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

    .weather h2 {
        margin: 0 0 -5px;
        color: #fff;
        font-size: 30px;
        text-align: center;
        text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15);
    }

    .weather ul {
        margin: 0 0 10px;
        padding: 0;
    }

    .weather li {
        color: #fff;
        display: inline-block;
    }

    .weather .currently {
        display:block;
        font-size:14px; 
        font-weight:bold;
    }

.forecast tr td{color:white;}




#weather i {
    color: #fff;
    font-family: weather;
    font-size: 40px;
    font-weight: normal;
    font-style: normal;
    line-height: 0.9;
    text-transform: none;
}
        
         #weather .iconw2 {
          color: #fff;
          font-size: 30px;
          text-transform: none;
        }

       #weather {
          font: 12px 'Open Sans', "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
        }
        
       #weather h2 {      
          margin: 0 0 -5px;
          color: #fff;
          font-size: 30px;
          text-align: center;
          text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15);
        }

        #weather ul {
          margin: 0 0 10px;
          padding: 0;
        }

        #weather li {
          color: #fff;
          display: inline-block;
        }

        #weather .currently {
          margin: -10px 0px -50px;
        }

        .DivWeat {
            margin-left:15px;
            box-shadow: 10px 10px 20px #aaa; 
            border-radius: 20px;  
            height:180px;
            min-width:160px;
            padding:10px;
        }

        .weatherdcolor {
            background-color: #F48B20;
        }

        .weatherpcolor {
            background-color: #F48B20;
        }

        #weather_boat  i,#weather_moto  i {
          color: #fff;
          font-family: weather;
          font-size: 40px;
          font-weight: normal;
          font-style: normal;
          line-height: 0.9;
          text-transform: none;
        }
        
         #weather_boat .iconw2, #weather_moto .iconw2 {
          color: #fff;
          font-size: 30px;
          text-transform: none;
        }

       #weather_boat,#weather_moto {
          font: 12px 'Open Sans', "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
        }
        
       #weather_boat h2, #weather_moto h2 {      
          margin: 0 0 -5px;
          color: #fff;
          font-size: 30px;
          text-align: center;
          text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15);
        }

        #weather_boat ul, #weather_moto ul {
          margin: 0 0 10px;
          padding: 0;
        }

        #weather_boat li, #weather_moto li {
          color: #fff;
          display: inline-block;
        }

        #weather_boat .currently, #weather_moto .currently {
          margin: -10px 0px -50px;
        }

.img-weather{
    position:relative;
    top: 8px;
}