/*
@copyright © 2013-2015 WesternBass.com ®
@author Michael Cardoso <mike@afflixion.com>
*/
/* 
    Created on : Aug 15, 2015, 10:43:55 AM
    Author     : Mike
*/

/*
 * Lakes and Reports
 */
#lakes, 
#map, 
.lake-data {
	width: 40%;
	float: left;
	clear: left;
	margin-right: 1em;
	margin-bottom: 1em;
}

.lake-data {
	overflow-x: hidden;
	overflow-y: hidden;
}

#map {
	max-height: 600px;
	overflow: hidden;
	margin-bottom: 1em;
	position: relative;
}
.map-open #map {
	height: 600px;
	width: 100%;
	float: none;
	clear: both;
}
#map > img {
	width: 100%;
  min-height: 150px;	/* will cause some distortion, but minor */
	-webkit-transform: translateY(0%);
	-o-transform: translateY(0%);
	-ms-transform: translateY(0%);
	-moz-transform: translateY(0%);
	transform: translateY(0%);
}
#map.interactive > img {
	cursor: pointer;
}
.map-open #map > img {
	-webkit-transform: scale(0.725) translateY(-19%);
	-o-transform: scale(0.725) translateY(-19%);
	-ms-transform: scale(0.725) translateY(-19%);
	-moz-transform: scale(0.725) translateY(-19%);
	transform: scale(0.725) translateY(-19%);
	display: none;
}
.map-open.animate #map > img {
	display: inline;
}

#map #map-actual {
	display: none;
}
.map-open #map #map-actual {
	width: 100%;
	height: 600px;
	display: block;
}
.animate #map #map-actual {
	display: none;
}
@-moz-document url-prefix() {
	.map-open .lake-reports {
		margin-top: 600px;	/* important for column to drop during animation in firefox */
	}
}
.animate #map,
.animate #map > img,
.animate .lake-reports {
	-webkit-transition: .4s linear;
	-o-transition: .4s linear;
	-ms-transition: .4s linear;
	-moz-transition: .4s linear;
	transition: .4s linear;
}

#map .wb-ovl {
	position: absolute;
	bottom: 10px;
	text-align: center;
	width: 100%;
	cursor: pointer;
}
#map .wb-ovl span {
	font-weight: bold;
	color: #fff;
	background: rgba(0,0,0,0.5);
	border-radius: 5px;
	padding: 0px 5px;
	display: block;
	font-size: smaller;
	margin: 2em;
	word-break: break-word;
	word-wrap: break-word;
}

.map-open #map .wb-ovl {
	display: none;
}

.item-list .item-body {
	display: inline;
}

/*
* lakeData begin
*/
.wb-lakedata {
	border: 1px solid #ccc;
	font-size: smaller;
	margin-bottom: 1em;
}
.wb-lakedata-title,
.wb-lakedata-date {
	font-size: smaller;
	padding-left: 0.5em;
	padding-right: 0.5em;
}
.wb-lakedata-title {
	font-weight: bold;
}
.wb-lakedata-data {
	width: 100%;
}
.wb-lakedata-data th {
	padding: 5px;
	text-align: center;
	font-size: smaller;
}
.wb-lakedata-data td {
	padding: 5px;
	text-align: center;
	white-space: nowrap;
}
.wb-lakedata-data .odd {
	background-color: #eee;
}
.wb-lakedata-data .even {
	background-color: #e5e5e5;
}
.wb-lakedata-data tr.mainHead th
{
	text-align: left;
}
.wb-lakedata-data tr.colHead th
{
	padding: 5px 0px;
}
.wb-lakedata .nowrap {
	white-space: nowrap;
}

@media (max-width: 583px){
	.wb-lakedata-data th:nth-child(5),
	.wb-lakedata-data td:nth-child(5) {
		display: none;
	}
}
@media (max-width: 445px){
	.wb-lakedata-data th:nth-child(4),
	.wb-lakedata-data td:nth-child(4) {
		display: none;
	}
}
@media (max-width: 364px){
	.wb-lakedata-data th:nth-child(3),
	.wb-lakedata-data td:nth-child(3) {
		display: none;
	}
}

/*
* lakeData end
*/

/*
* wb-weather begin
*/
.wb-weather {
	border: solid 1px #ccc;
	background: #eee;
	padding: 0.5em;
	font-size: smaller;
}
.wb-weather-data {
	display: table;
	table-layout: fixed;
}
.wb-weather-temp {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	white-space: nowrap;
	padding-right: 0.5em;
	font-weight: bold;
}

.wb-weather-data > .wb-weather-period {
    width: 50%;
    display: table-cell;
    vertical-align: middle;
    text-align: left;
}

.wb-weather-period .wb-weather-period {
	display: table;
	margin: 0 auto;
}

.wb-weather-date {
    font-size: smaller;
}

.wb-weather-period-img {
    display: table-cell;
    vertical-align: middle;
}
.wb-weather-period-img img {
	max-width: 100%;
}

.wb-weather-period-text {
	display: table-cell;
	vertical-align: middle;
	padding-left: 0.5em;
}

.wb-weather-period-desc {
	font-weight: bold;
}

.wb-weather-period-label {
  display: table-cell;
	position: relative;
	width: 16px;
}
.wb-weather-period-label-actual {
  position: absolute;
	width: 55px;
	text-align: center;
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
	height: 58px;
	font-size: smaller;
	line-height: 16px;
}
@media (max-width: 550px){
	.wb-weather-temp {
		white-space: normal;
		display: block;
		text-align: left;
		padding-right: 0;
	}
	.wb-weather-hi, 
	.wb-weather-lo {
		display: inline;
		white-space: nowrap;
	}
	.wb-weather-hi {
		margin-right: 0.5em;
	}
	.wb-weather-data {
		display: block;
	}
	.wb-weather-data > .wb-weather-period {
    display: block;
		width: auto;
	}
	.wb-weather-period {
		width: 100%;
	}
	.wb-weather-period-img img {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
	}
}
/*
* wb-weather end
*/

/*
* reports begin
*/
.report-submit {
	float: right;
	margin-left: 1em;
	margin-bottom: 1em;
}

.list-selects {
	float: right;
	clear: right;
	margin-bottom: 1em;
}

.list-selects div {
	padding-right: 0;
}

.reports .item-left {
	vertical-align: top;
	height: auto;
}
.reports .lake {
	margin-bottom: 0px;
	margin-top: 0.25em;
}
.reports .heading {
	margin-bottom: 0px;
}
.reports > .item-list > li > .item {
	display: block;
	overflow: visible;
}
.report {
	margin-bottom: 1em;
}
.report p {
	word-wrap: break-word;
	overflow-wrap: break-word;
	word-break: break-word;
}

/*
  Kludge so image doesn't float below report
*/
.lake .report.first img.vip {
  display: none;
}
.lake .map-open .report.first img.vip {
	display: inline;
}
/* End Kludge */

img.vip {
	width: 20%;
	float: right;
	clear: right;
	margin: 1em;
}
/*
* reports end
*/

.region .reports .item-left > .item-location {
	text-align: center;
	font-size: smaller;
}
.reports .item-left > .item-location > .item-location {
	font-size: smaller;
	font-weight: bold;
}
