/* weatherfeed hack */


div.view-view-weather-feed {
  background: url("../images/northport-img.jpg") no-repeat center center;
  min-height: 690px;
  padding-top:20px;
  padding-bottom: 30px;
  position:relative;
  font-size: 11px;
}
.view-view-weather-feed  h3 {
  color: #ffffff;
}


#wrb-a p,
#wrb-b p,
#tower p,
#adminbuild p,
#tugjetty p,
#berth2 p
{
  font-size: 16px;
  margin-bottom: 2px;
}

#o-wrb-a-marker {
  background: url("../images/mp.png") no-repeat center center;
  position:absolute;
  top: 100px;
  left: 817px;
  height: 41px;
  width: 20px;
}

#o-wrb-b-marker {
  background: url("../images/mp.png") no-repeat center center;
  position:absolute;
  top: 117px;
  left: 774px;
  height: 41px;
  width: 20px;
}
#o-tugjetty-marker {
  background: url("../images/mp.png") no-repeat center center;
  position:absolute;
  top: 315px;
  left: 365px;
  height: 41px;
  width: 20px;
}
#o-berth2-marker {
  background: url("../images/mp.png") no-repeat center center;
  position:absolute;
  top: 401px;
  left: 250px;
  height: 41px;
  width: 20px;
}
#o-adminbuild-marker {
  background: url("../images/mp.png") no-repeat center center;
  position:absolute;
  top: 300px;
  left: 566px;
  height: 41px;
  width: 20px;
}

.title.wpg {
 width: 400px; 
 display:inline; 
 height: 30px;
}
#hbtn {
 display:inline;
 width: 100px;
 float: right;

}
#timest {
  position:absolute;
  padding-left:10px;
  background-color:#000000;
  filter:alpha(opacity=40);opacity:.6;
  top: 10px;
  left: 10px;
  width: 245px;
  font-weight:bold;
  color:#ffffff;
}

#weatherfooter {
 clear: both;
 position: absolute;
 z-index: 10;
 height: 2em;
 /*margin-top: 61em;  */
 top:642px;
 left:20px;
 font-size:10px;

}

#berth2 {
  padding-left:10px;
  padding-bottom:10px;
  position:absolute;
  top: 435px;
  left: 280px;
  background-color:#000000;
  filter:alpha(opacity=40);opacity:.6;
  width: 160px;
  color:#ffffff;
}

#tugjetty {
  padding-left:10px;
  padding-bottom:10px;
  position:absolute;
  top: 240px;
  left: 205px;
  background-color:#000000;
  filter:alpha(opacity=40);opacity:.6;
  width: 160px;
  color:#ffffff;
}
#adminbuild {
  padding-left:10px;
  padding-bottom:10px;
  position:absolute;
  top: 300px;
/*  top: 165px; */
  left: 620px;
  background-color:#000000;
  filter:alpha(opacity=40);opacity:.6;
  width: 160px;
  color:#ffffff;
}

#tower {
  padding-left:10px;
  padding-bottom:10px;
  position:absolute;
  top: 50px;
  left: 400px;
 /* left: 350px; */
  background-color:#000000;
  filter:alpha(opacity=40);opacity:.6;
  width: 160px;
  color:#ffffff;
}



#wrb-a {
  padding-left:10px;
  padding-bottom:10px;
  position:absolute;
  top: 50px;
  left: 630px;
 /* left: 350px; */
  background-color:#000000;
  filter:alpha(opacity=40);opacity:.6;
  width: 160px;
  color:#ffffff;
}
#wrb-b {
  padding-left:10px;
  padding-bottom:10px;
  position:absolute;
  top: 50px;
  left: 850px;
  background-color:#000000;
  filter:alpha(opacity=40);opacity:.6;
  width: 160px;
  color:#ffffff;
}

#datatable-1 {
  clear:both;
  margin: 3em 0;
}

/* weatherfeed hack end */

@media only screen and (max-width: 768px) {
  /* rules that only apply for canvases narrower than 1000px */

    
div.view-view-weather-feed {
  background:none;
  padding-top: 5px;
}

.page-weatherfeed #block-menu-menu-menu-top-links-menu,
#flexslider-1,
.page-weatherfeed #footer,
.page-weatherfeed #breadcrumbs
{
  display: none;
}


#logo {
  width: 50%;
}
h1.page-title {
  font-size: 20px;
} 

.page-weatherfeed #page-wrap {
  margin:  0 auto 20px auto;
  padding: 0 20px 20px 20px;
}

#timest,
#wrb-a, 
#wrb-b,
#tugjetty,
#adminbuild,
#tower,
#berth2 {
  position:unset;
  width: 100%;
  border-bottom: 2px solid #0b8c38; 
  opacity: .7;
}

#weatherfooter {
  position:unset;
}

/* #wrb-a {
  top: 5%;
  left: 2%;


}
#wrb-b {
  top: 24%;
  left: 2%;


}

#tugjetty {
  top: 46%;
  left: 2%;

}

#adminbuild {
  top: 5%;
  left: 50%;

}

#tower {
  top: 29%;
  left: 50%;

}

#berth2 {
  top: 54%;
  left: 50%;

}
 */

}

@media only screen and (device-width: 768px) and (orientation: landscape) {
  /* rules for iPad in landscape orientation */
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  /* iPhone, Android rules here */
}