body {
      /*font-family: Verdana, Geneva, sans-serif;*/
	  font-family: Fontin;
      background-image:url('../img/grey.jpg');
	  background-repeat:repeat-x;
      margin: 0 auto;
      padding: 0;
      font-size: 100%;
 }
 
 
 
 @font-face { 
 	font-family: Sofia;
 	src: url('Sofia-Regular.otf') format("opentype");
 }
 
 /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */
 @font-face { 
 	font-family: Fontin;
	font-weight: normal;
 	src: url('Fontin_Sans_R_45b.otf') format("opentype");
 }
 
 @font-face { 
 	font-family: Fontin;
	font-weight: bold;
 	src: url('Fontin_Sans_B_45b.otf') format("opentype");
 }
 

#container {
      margin: 0 auto;
      max-width: 960px;
	  box-shadow: 10px 10px 5px #888;
	  background-color:#EDEBDF;
 }
 
header {
     height: 180px;
     background-image:url('../img/calclim.png');
 	 text-align: left;
 	 width:100%;
 }
 
#headermap {
     height: 180px;
     background-image:url('../img/calclim.png');
  	 text-align: left;
  	 width:100%;
	 margin-top: 20px;
  }

 h1 {
	 font-family: Sofia;
	 font-size: 35px;
	 font-color: #44735C;
	 padding-left:20px;
	 padding-top: 6px;
 }
 
 /* to overwrite the css for h1 on page with map */
 .mapheader {
	 font-family: Sofia;
	 font-size: 35px;
	 font-color: #44735C;
	 padding-left:20px;
	 padding-top: 6px;
 }


footer {
	clear:both;
    /* width:95.625%; */
	width: 940px%;
	height: 65px; 
    padding: 10px;
    border:1px solid #F2F2F2;
    font-size:12px;
    background-color:#EDEBDF;
    margin:0 0 20px 0; /* bump the page off the browser bottom */
}

#leftlogo {
	height: 60px;
	width: 38%;
	padding-left: 5px;
	float: left;
}

#rightlogo {
	padding-right: 5px;
	float: right;
	/*width: 330px;*/
	width: 32%;
	height:60px;
}

#centerfoot {
    float: left;
	text-align: center;
    font-size:12px;
	width: 25%;
	height: 60px;
}

.cnap {
	width: 149px;
	height: 60px;
}

.wrcc {
	width: 185px;
	height:60px;
}

.scripps {
	width: 60px;
	height: 60px;
}

.cec {
	width: 66px;
	height: 60px;
	padding-left: 10px;
}

.dri {
	width: 101px;
	height: 60px;
	padding-left: 10px;
}

nav {
 	padding-top: 3px;
	font-size: 16px;
	color: #5C7A99;
	width: 100%;
	padding-left: 5px;
	padding-bottom: 5px;
	height: 30px;
	margin-bottom: 10px;
	position: relative;
	z-index: 10;
 }
 

 /* this creates a nice blue aside panel */
aside {
 	float: left;
	width: 20%;
	padding-left:10px;
	padding-top: 5px;
	margin-left: 10px;
    background-image:url('../img/blue_gradient.jpg');
  	background-repeat:repeat-x;
	border-radius:15px;
 }

 /* this creates a section that floats next to the aside 
section {
	float: right;
	width: 75%;
    padding-right:20px;
    font-size:16px;
    color:#555759;
} */
 
 
 section {
 	float: left;
 	width: 95%;
    padding-left: 20px;
    font-size:18px;
    color:#555759;
 } 

.dashpics {
	 width: 185px;
	 height: 246px;
	 padding: 10px;
 } 
 
 .listhead {
	 /*font-family: Verdana, Geneva, sans-serif;*/
	 font-style: italic;
	 padding-right: 30px;
 }
/* make links underlined */ 
section a {
	 text-decoration: underline;
	 color:#555759; 	
 }
 
 .maplinks {
 	padding-right: 10px;
 }
 
footer a {
 	 text-decoration: none;
 	 color:#555759; 	
 }
 
 .dashheader {
	 text-align: center;
	 margin-top: 40px;
	 margin-bottom: 30px;
	 font-weight: normal;
 }
 
 /* for stationmap page-- loading*/
 #loading {
    background:url('../img/loader2.gif') no-repeat center center;
    height: 250px;
    width: 250px;
    position: fixed;
    z-index: 1000;
    left: 30%;
    top: 50%;
    margin: -25px 0 0 -25px;
 }
 
 
 .tooltip {
    display: block;
 	visibility: hidden;
 	position: absolute;
 	left: 30em;
 	top: 0;
 	padding: 0.5em;
 	width: 10em;
 	border: solid 2px #002952;
 	background-color: #D1E0FF;
	color: #002952;
 }
 
 #cool {
     color: #555759;
 }
 
 /* styles for table on front page */
 th {
	 font-weight: normal;
	 font-size: 16px;
 }
 
 .row2 {
	 padding-top: 30px;
 }
 
.usdm {
	 width: 185px;
	 height: 143px;
	 padding: 10px;
 }

/* keep links in footer grey, no underline */
a.flinks {
    font-size:12px;
    color:#555759;
    text-decoration: none;
}

/* styles for list of links, etc */
li.linkslist {
	padding-bottom: 10px;
}

a.linksul {
	text-decoration: none;
}


/* stylings for forms */
label {
	font-size:14px;
	padding-right:5px;
	color:#5B74AB;
	position: relative;
	margin-top: 10px;
}

input {
	margin-top: 10px;
}

 .morespace {
    margin-bottom: 20px;
	margin-top: 10px;
}

select {
	margin-top: 10px;
}

textarea {
    margin-top: 10px;
	width: 350px;
	height: 150px;
	display: block; 
	margin-top: 5px;
}

.checktext {
	font-size:14px;
	padding-right:5px;
	color:#5B74AB;
	margin-top: 10px;
	margin-bottom: 5px;	
}


/* stylings for the navigation menu */
.menu { 
	margin:0; padding:0; 
}

.menu li { 
	list-style:none; 
	float:left; 
	/*font:12px Arial, Helvetica, sans-serif #111;*/
	/*font-weight: bold;*/
}

.menu li a:link, .menu li a:visited { 
	display:block; 
	text-decoration:none; 
	background-color:#7AA3CC; 
	padding: 0.5em 2em; 
	margin:0; 
	border-right: 1px solid #fff; color:#111; 
} 

.menu li a:hover { 
	background-color:#D6EBFF; 
}

/* stylings for sub-menu */
.menu li ul { 
	position:absolute; 
	visibility:hidden; 
	border-top:1px solid #D6EBFF; 
	margin:0; 
	padding:0; 
}

.menu li ul li { 
	display:inline; 
	float:none; 
}

.menu li ul li a:link, .menu li ul li a:visited { 
	background-color:#7AA3CC; 
	width:auto; 
}

.menu li ul li a:hover { 
	background-color:#D6EBFF; 
}

/* for google maps for station data */
#id_map_window {
    width: 800px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 20px;
	color: #000000;
}

div.x-grid3-hd-inner, div.x-grid3-cell-inner {
    font-size: 12px;
}

.x-panel-header-text {
	font-size: 16px;
}

#ext-gen31 {
	font-size: 14px;
}

#ext-gen33 {
	font-size: 14px;
}

/* styles for the climate anomaly maps tables */

.datatables {
	background-color: #F0F0F0;
	text-align: center;
	text-decoration: none;
	font-size: 12px;
	font-family: "Arial", sans-serif;
	color: #000000;
}

.datatables a {
	text-decoration: none;
	color: #000000;
}

.smaller {
	font-size: 13px;
	color: #000000;
}

.smallergrey {
	font-size: 13px;
}

.maxt {
	background-color: #F0E0E0;
	text-align: center;
	text-decoration: none;
	font-size: 12px;
	font-family: "Arial", sans-serif;
	color: #000000;
}


.maxt a {
	text-decoration: none;
	color: #000000;
}

.avgt {
	background-color: #F0F070;
	text-align: center;
	text-decoration: none;
	font-size: 12px;
	font-family: "Arial", sans-serif;
	color: #000000;
}

.avgt a {
	text-decoration: none;
	color: #000000;
}

.mint {
	background-color: #A0E0E0;
	text-align: center;
	text-decoration: none;
	font-size: 12px;
	font-family: "Arial", sans-serif;
	color: #000000;
}

.mint a {
	text-decoration: none;
	color: #000000;
}

.precip {
	background-color: #A0E0A0;
	text-align: center;
	text-decoration: none;
	font-size: 12px;
	font-family: "Arial", sans-serif;
	color: #000000;
}

.precip a {
	text-decoration: none;
	color: #000000;
}

.hdd {
	background-color: #F0E0E0;
	text-align: center;
	text-decoration: none;
	font-size: 12px;
	font-family: "Arial", sans-serif;
	color: #000000;
}

.hdd a {
	text-decoration: none;
	color: #000000;
}

.cdd {
	background-color: #A0E0E0;
	text-align: center;
	text-decoration: none;
	font-size: 12px;
	font-family: "Arial", sans-serif;
	color: #000000;
}

.cdd a {
	text-decoration: none;
	color: #000000;
}

.gdd {
	background-color: #A0E0A0;
	text-align: center;
	text-decoration: none;
	font-size: 12px;
	font-family: "Arial", sans-serif;
	color: #000000;
}

.gdd a {
	text-decoration: none;
	color: #000000;
}

/*for devices with screen<500px-- still working on this
@media screen and (max-width: 500px) {
	header {font-size:80%;}
	section {font-size:80%;}
	a.hlinks {font-size:80%;}
	#content {background-color:#FF99CC}
} */