.forecast {}

.forecast table.data, .current-weather table { border: none; /*border-top: #205F9F 2px solid; border-bottom: #205F9F 2px solid;*/ width: 100%;  }
.forecast .data th { text-align: center; background-color: #fff; font-size: 0.75em; font-weight: normal;  }
.forecast .data td { text-align: center;  font-weight: normal; color:#2E4C66; font-size: 1em; padding-left: 0.1em; padding-right: 0.1em; }
.forecast .data td > div { text-align: center; }
.forecast .data tr:nth-of-type(even) { opacity: 0.9; }
.forecast .data tr.help { background-color: #FFFFBF !important; }
.forecast .panel { color:#2E4C66; padding-bottom: 0.5em; padding-top: 0; }
.forecast .panel p { color:#2E4C66; line-height: 1.25em; font-size: 0.925em; }
.forecast .panel .wind p { margin-bottom: 0; }

.forecast .data .divider td, .forecast .data .divider th { border-bottom: rgba(255,255,255,0.5) 1px solid; }
.forecast .data small { font-size: 0.75em; }
.forecast .data .small-header { font-size: 0.5em; text-transform: uppercase; font-weight: 500; }

.forecast .three-hour th {width: 25%;}
.forecast .three-hour .time td {width: 12.5%;}

.forecast .six-hour th {width: 25%;}

.forecast .twelve-hour th {width: 50%;}
.forecast .twelve-hour tr th:nth-of-type(even) { border-left: #fff 2px solid; }
.forecast .twelve-hour tr td:nth-of-type(even) { border-left: #fff 2px solid; }
.forecast .twelve-hour tr th:nth-of-type(odd) { border-right: #fff 2px solid; }
.forecast .twelve-hour tr td:nth-of-type(odd) { border-right: #fff 2px solid; }
.forecast .twelve-hour h4 { padding: 0.25em 0.5em; margin-bottom: 0; font-size: 1.25em;  }
.forecast .twelve-hour table { margin-bottom: 0.25em; }

.forecast .long td {width: 14.28%;}
.forecast .long .weekend { color: #FF3300; }
.forecast .long td { vertical-align: middle; }
.forecast .long tr:nth-of-type(even) { background-color: #F1F7FC; opacity: 1; }

.forecast .detail td { vertical-align: middle; border-bottom: 2px solid #FFFFFF;}

.forecast .data.current {}
.forecast .data.current ul > li { padding-bottom: 1em; line-height: 1em; }
.forecast .data.current ul > li small { display: block; padding-bottom: 0.5em; color: #999; }
.forecast .data.current ul > li.hide { display: none !important;}
.forecast .data.current ul > li p { margin-bottom: 0; }
.forecast .data.current ul > li .fa { line-height: inherit; }
.forecast .data.current .icon { padding: 2em; }
.forecast .data.current  .waves { background-image: url(../img/wave_icons/small_wave.png); background-repeat: repeat-x; background-position: left bottom; }
.forecast .data.current  .underwater { background-color: #0067B5; color: #fff; padding: 0.625em 0; }
.forecast .data.current  .underwater small { color: rgba(255,255,255,0.5); line-height: 1.5em; }

.forecast .data .night { background-color: #A8CCE5; }
.forecast .data .morning { background-color: #E0EEF8;}
.forecast .data .day { background-color: #F1F7FC;}
.forecast .data .evening { background-color: #D4E7F5;}
.forecast .data .panel.night { border-color: #A8CCE5; background: none;  }
.forecast .data .panel.morning {  border-color: #E0EEF8; background: none; }
.forecast .data .panel.day {  border-color: #F1F7FC; background: none; }
.forecast .data .panel.evening {  border-color: #D4E7F5; background: none; }
.forecast .data .underwater td { background-color: #0067B5; color: #fff; vertical-align: middle; }

.forecast .data .time td { text-align: center; font-size: 0.875em; }
.forecast .data .weather td { text-align: center; padding-top: 0.25em; padding-bottom: 0; }
.forecast .data .weather .night { background-repeat: repeat-x; background-position: left bottom; }
.forecast .data .weather .morning {  background-repeat: repeat-x; background-position: left bottom;}
.forecast .data .weather .day {  background-repeat: repeat-x; background-position: left bottom;}
.forecast .data .weather .evening { background-repeat: repeat-x; background-position: left bottom;}
.forecast .data .weather .icon { width: 70%; height: auto; max-width: 4.5em; }
.forecast .data .temperature { font-size: 1.5em; }
.forecast .data.long .temperature { font-size: 1.25em; }
.forecast .data .feeled-temperature { font-size: 1em; }
.forecast .data tr.precip-bar td, .forecast .data div.precip-bar, .forecast .data td.precip-bar { padding: 0px; vertical-align: bottom; text-align: center; height: 48px; width: 32px;  background-image: url(../img/forecasts/grid.png); background-repeat: repeat; background-position: left 2px; border-bottom: rgba(255,255,255,0.5) 1px solid; }
.forecast .data .precip-bar div, .forecast .data div.precip-bar > div { font-size: 0px; display: block; position: relative; text-align: center; min-width: 24px; max-width: 40px; margin: 0 auto; background: linear-gradient(to right, #0082C7 0%, #0067B5 70%) repeat-x scroll 0 0 #0B68B3; color: #fff; }
.forecast .data .wind-direction { }
.forecast .data .wind td {  }
.forecast .data .wind img { }
.forecast .data .wave { opacity: 1 !important; }
.forecast .data .wave td { padding: 0px; vertical-align: bottom; text-align: center; font-size: 4em; background-image: url(../img/forecasts/grid.png); background-repeat: repeat; background-position: left 2px;  }
.forecast .data .wave .wave-icon { width: 100%; }
.forecast .data .humidity td, .forecast .data .advanced td { }
.forecast .data .alert { padding: 0.1em 0; }
.forecast .data .alert span { display: inline-block; border: 2px solid #E6993A; padding: 0.2em; }
.forecast .data .danger span { background-color: #FF3300; border: none; color: #fff; padding: 0.25em; }

@media only screen and (max-width: 40.062em) {
 	.forecast .table-container { margin-left: -0.9em; margin-right: -0.9em; overflow-x: auto; /* width: 100%; overflow-y: hidden; overflow-x: scroll;  -webkit-overflow-scrolling: touch; */ }
 }

#graph_forecast {}
#graph_forecast img { display: block; margin-bottom: 1em;}

/* события */
.event_msg { margin: 0.5em 0; padding: 0.2em 0.7em; border: #F7A531 1px solid; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.event { margin: 8px 0 8px 0; padding-left: 26px; background-repeat: no-repeat; background-position: left top;}
.event .comment { color: #999;}
.pr50 { background-image: url(../img/warning_icons/adverse_small.gif); }
.pr100 { background-image: url(../img/warning_icons/danger_small.gif); }

td .adverse {
    background-color: #F75A31;
    display: inline;
    color: #fff;
    padding: 3px;
    margin: 5px;
    font-weight: bold;
    -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
}

td.temperature .adverse {
    font-weight: normal !important;
}

/* .text_forecast { width: 635px;} */
.text_forecast h3 { border-bottom: #205F9F 3px solid; margin: 0px; }
.text_forecast p { margin: 0; }
.text_forecast .words { margin-bottom: 16px; }

.current-weather {
    width: 70%;
}

.current-weather dl {
    margin: 1em 80px;
    clear: both;
}

.current-weather dl dt, .current-weather table td.title {
	float:left;
	font-weight:bold;
    display: inline;
    margin-right: 1em;
}

.current-weather dl dt:after {
    content: ":";
}

.current-weather dl dd {

}

.current-weather .main img {
    float: left;
    height: 60px;
    width: 60px;
    overflow: hidden;
    margin-right: 1em;
}

.current-weather .main .temperature {
    font: 25px Tahoma, Arial, Helvetica, sans-serif; font-weight: normal;
    color: #2E4C66;
    display: block;
    height: 60px;
    line-height: 60px;
}

/* Wind direction */
.rotate-0 {}
.rotate-45 { transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg);  }
.rotate-90 { transform: rotate(90deg);  -webkit-transform: rotate(90deg);  -o-transform: rotate(90deg); }
.rotate-135 { transform: rotate(135deg); -webkit-transform: rotate(135deg); -o-transform: rotate(135deg); }
.rotate-180 { transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); }
.rotate-225 { transform: rotate(225deg); -webkit-transform: rotate(225deg); -o-transform: rotate(225deg); }
.rotate-270 { transform: rotate(270deg); -webkit-transform: rotate(270deg); -o-transform: rotate(270deg); }
.rotate-315 { transform: rotate(315deg); -webkit-transform: rotate(315deg); -o-transform: rotate(315deg); }
.rotate-360 { }