p, tr, h1, h2, h3, h4, h5, h6 {
    font-family: Roboto,Verdana;
}

h1, h2, h3 , h4 {color: #2e6da4;}

p{
    font-size:13px;
}

.glosBlue {color: #2e6da4}

mySidenav{border-style:none;}

#navHeader{
    font-family: Roboto,Verdana;
    line-height:0;
    font-size: 15px;
    font-weight: 500;
}

a#navFooter{
    font-family: Roboto,Verdana;
    font-size: 14px;
    font-weight: 500;
		padding: 0px;
}

button#homepage {
    margin-top: 30px;
    padding: 10px;
    font-family: Roboto,Verdana;
    font-size: 14px;
    font-weight: 500;
}

button#feedback {
    margin-top: 30px;
    padding: 10px;
    font-family: Roboto,Verdana;
    font-size: 14px;
    font-weight: 500;
}

button#units {
    margin-top: 30px;
    padding: 10px;
    font-family: Roboto,Verdana;
    font-size: 14px;
    font-weight: 500;
}

img.headerLogos{
	float:left;
	height:50px;
	width:175px;
}

@media (max-width:450px){
    img.headerLogos{
			height:40px;
			width:140px;
		}
    .w3-container{
        padding-left: 4px!important;
        padding-right: 4px!important;
    }
    .w3-padding {
        padding-left: 4px !important;
        padding-right: 8px !important;
    }
}

/*Index Page Styling*/
table#buoySummary tr {font-size:10px;}
table#buoySummary thead {font-weight: 700;}
table#buoySummary thead td {text-align: center;}
table#buoySummary td.homeWindSpDir {padding-left: 0px; padding-right: 0px}
table#buoySummary td.homeWaveHeight{text-align:right;width:70px;padding-right:16px}

@media (max-width:450px) {
    #buoySummary.w3-table td {
        padding: 4px;
    }
    table#buoySummary td.homeWaveHeight {text-align: right;width: 70px;padding-right: 10px}
}

#NWSForecast img{
	width:60px;
}

@media (min-width:590px){
    #NWSForecast img{
			width:100px;
		}
}

/*Buoy station styling*/
@media (min-width:993px){
    #staticHeader{
        margin-right:100px;
    }
}

#buoyCam, #ThermistorLine, #ThermistorHeat, #MarineForecast, #buoyLocation, #stationMeta, #ADCP, footer {
    max-width: 800px;
    margin: auto;
}

p#stationID {
    font-family: Roboto,Verdana;
    line-height: 0;
    font-size: 18px;
    font-weight: 500;
    color: rgb(51,51,51);
}

#stationTime{
		margin-top:0px;
		font-size: 16px;
}

/*Make text smaller for station ID and timeif using a phone with small screens*/
@media (max-width:358px){
    p#stationID{
			font-family: Roboto,Verdana;
			line-height: 0;
			font-size: 16px;
			font-weight: 500;
			color: rgb(51,51,51);
		}
		p#stationTime{
			margin-top:0px;
			font-size: 13px;
		}
}

#ErieAcc,#MichiganAcc,#SuperiorAcc,#HuronAcc,#OntarioAcc,#otherAcc{
    font-family: Roboto,Verdana;
    line-height: 1;
    font-size: 12px;
}

div[id='Lake Erie'], div[id='Lake Michigan'], div[id='Lake Superior'], div[id='Lake Huron'], div[id='Lake Ontario'], div[id='Other Lakes'] {
    font-family: Roboto,Verdana;
    line-height: 1.5;
    font-size: 13px;
}

div[id='Lake Michigan']{
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
#ErieAcc:active{
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
div[id='Other Lakes'] {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

img.sponsors{
	max-height:100px;
	max-width:160px;
	vertical-align:middle;
}

/*20% smaller once screen goes below 450px)*/
@media (max-width:450px){
    img.sponsors{
			max-height:80px;
			max-width:128px;
			vertical-align:middle;
		}
    /*Change padding around accord*/
    .w3-table th:first-child, .w3-table td:first-child, .w3-table-all th:first-child, .w3-table-all td:first-child {
        padding-left: 0px;
        padding-right: 0px;
    }

    /*Change padding around graph icon*/
    td.graph{
        padding-left: 2px;
        padding-right: 2px;
    }
    /*Change padding of rows*/
    .w3-table td{
        padding-top: 4px;
        padding-bottom: 4px;
    }

}

table#realtime tr {
    font-size:15px;
	text-align:center;
}

table#realtime td,i{
	/*padding-top:3px;
	padding-bottom:3px;*/
	vertical-align: middle;
}
table#realtime td.float_value{
	padding-left:0px;
	padding-right:0px;
	margin-right:0px;
	width:18%;
}
table#realtime#TAccord td {
	padding-left:0px;
	padding-right:0px;
	width:30px;
}


.video-js {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
}
	
.video-js.auto-height {
	height: 0 !important;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	max-width: 100%;
	width: auto !important;
}

/* Show the controls (hidden at the start by default)*/
/.video-js .vjs-control-bar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
#NWSForecast img{
	width:60px;
}

@media (min-width:590px){
    #NWSForecast img{
			width:100px;
		}
}

table#NWSForecast td.NWSIconSubtext {
	padding-top:0px;
	padding-bottom:0px;
}

.gm-style-iw {
	width: auto !important;
}

#googleMapcontent {
}

#googleMapLegend {
    font-family: Arial, sans-serif;
    background: #fff;
    padding: 2px;
    margin: 10px;
    border: 1px solid #000;
		text-align: left;
		vertical-align:middle;
  }

g.highcharts-label.highcharts-legend-title text {
    transform: translateX(90px);
}