/* moon */

@font-face {
  font-family: 'weathericons';
  src: url('../font/weathericons-regular-webfont.eot');
  src: url('../font/weathericons-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../font/weathericons-regular-webfont.woff2') format('woff2'), url('../font/weathericons-regular-webfont.woff') format('woff'), url('../font/weathericons-regular-webfont.ttf') format('truetype'), url('../font/weathericons-regular-webfont.svg#weather_iconsregular') format('svg');
  font-weight: normal;
  font-style: normal;

}
.wi {
	display: inline-block;
	font-family: 'weathericons';
	font-style: normal;
	font-weight: normal;
	line-height: 1;
}
.wi-moon-0:before {
  content: "\f095";
}
.wi-moon-1:before {
  content: "\f096";
}
.wi-moon-2:before {
  content: "\f097";
}
.wi-moon-3:before {
  content: "\f098";
}
.wi-moon-4:before {
  content: "\f099";
}
.wi-moon-5:before {
  content: "\f09a";
}
.wi-moon-6:before {
  content: "\f09b";
}
.wi-moon-7:before {
  content: "\f09c";
}
.wi-moon-8:before {
  content: "\f09d";
}
.wi-moon-9:before {
  content: "\f09e";
}
.wi-moon-10:before {
  content: "\f09f";
}
.wi-moon-11:before {
  content: "\f0a0";
}
.wi-moon-12:before {
  content: "\f0a1";
}
.wi-moon-13:before {
  content: "\f0a2";
}
.wi-moon-14:before {
  content: "\f0a3";
}
.wi-moon-15:before {
  content: "\f0a4";
}
.wi-moon-16:before {
  content: "\f0a5";
}
.wi-moon-17:before {
  content: "\f0a6";
}
.wi-moon-18:before {
  content: "\f0a7";
}
.wi-moon-19:before {
  content: "\f0a8";
}
.wi-moon-20:before {
  content: "\f0a9";
}
.wi-moon-21:before {
  content: "\f0aa";
}
.wi-moon-22:before {
  content: "\f0ab";
}
.wi-moon-23:before {
  content: "\f0ac";
}
.wi-moon-24:before {
  content: "\f0ad";
}
.wi-moon-25:before {
  content: "\f0ae";
}
.wi-moon-26:before {
  content: "\f0af";
}
.wi-moon-27:before {
  content: "\f0b0";
}
div#almanac {
	margin-top: 1.8em;
}
.moonphases {
	height:17px;
	width:17px;
}

/* chart */

.chartimage {
	width:100%;
	height:auto;
}

.red {
	color:#b44242;
}

.blue {
	color:#4282b4;
}

.green {
	color:#42b442;
}

.black {
	color:#000000;
}

.grey {
	color:#999999;
}

.charthead  {
	padding:1em;
}
.charthead  span{
	padding-right:1em;
}

/* page */

div#header {
	padding: 20px;
}

/* loader */

.modal {
	position: fixed;
	z-index: 999;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	background-color: Black;
	filter: alpha(opacity=60);
	opacity: 0.6;
	-moz-opacity: 0.8;
}
.center {
	z-index: 1000;
	margin: 300px auto;
	padding: 30px;
	width: 30px;
	border-radius: 10px;
	filter: alpha(opacity=100);
	opacity: 1;
	-moz-opacity: 1;
}

/*
.center img {
	height: 50px;
	width: 50px;
}
*/
/* menue */

.ui-navbar {
  padding-bottom:10px;
}
.ui-collapsible-content {
	padding:0;
	border: none;
}
.ui-collapsible-inset.ui-collapsible-themed-content .ui-collapsible-content {
	border: none;			
}
.ui-corner-all {
	border-radius:0;
}
.ui-bar {
	border-bottom:none;
}
.heading .ui-btn {
	background-color: #3388cc;
}
div#appcontent1, div#appcontent2  {
	background-color: #e9e9e9;
}

ul#menu {
	margin-top: 20px;
}
.heading a {
	padding-top: 20px;
}

table {
	font-size:0.7em;
	width:100%;
}

table tr td {
	font-size:0.7em;
}

/* breakpoint */

@media all and (min-width: 360px){
   img {
      max-width:100%; 
      height:auto;
   }
}
@media all and (max-width: 360px) {
   body {
      font-size:0.7em;
   }
}