
/*@import "http://fonts.googleapis.com/css?family=Droid+Serif";
/* Above line is to import google font style */

* {
  box-sizing: border-box;
}

body {
  margin: 0;
}


/* latin */
@font-face {
  font-family: 'Droid Serif';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/droidserif/v19/tDbI2oqRg1oM3QBjjcaDkOr9rAU.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


.header {
	color: #f58742;
	background-color: #4272f5;
	text-align: center;
	padding: 10px;
}

/* The navbar container */
.topnav {
  overflow: hidden;
  background-color: #4272f5;
}

/* Navbar links */
.topnav a {
  float: left;
  display: block;
  color: #f58742;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

/* Links - change color on hover */
.topnav a:hover {
	color: black;
  background-color: #f58742;
  text-shadow:2px 2px 2px #cfcfcf;
}


/* Create three equal columns that float next to each other */
.column {
  float: left;
  width: 50%;
  background-color:#f0f8ff;
  font-size: 16px;
}

/* Create 2 equal columns that float next to each other */
.divPOI {
  float: left;
  width: 50%;
  background-color:#f0f8ff;
  font-size: 16px;
}

.content {
	padding:0 20px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.footer {
	background-color: #4272f5;
	padding:0 20px;
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 2.5rem;            /* Footer height */
}



/* Community */
.form {
width:400px;
height:180px;
float:left;
background-color:#fff;
font-family:'Droid Serif',serif;
padding-left:30px
}

.divB {
width:100%;
height:100%;
background-color:#fff;
border:dashed 1px #999
}

.divList {
width:100%;
float:left;
background-color:#f0f8ff;
border-right:dashed 1px #999
}

.divMap {
width:90%;
height:300px;
padding:20 20px;
float:center;
background-color:#fff;
border:dashed 1px #999
}
 

p {
text-align:center;
font-weight:700;
color:#5678C0;
text-shadow:2px 2px 2px #cfcfcf
}

.form h2 {
text-align:center;
text-shadow:2px 10px 2px #cfcfcf
}

a {
text-decoration:none;
margin:2px 0 0 30px;
padding:3px;
color:#1F8DD6
}
a:hover {
text-shadow:2px 2px 2px #cfcfcf;
}

.button {
	background-color: #4272f5;
	color: white;
	border: none;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other on smaller screens (600px wide or less) */
@media screen and (max-width: 1000px) {
	  .column {
		width: 100%;
		/*font-size: 30px;*/
	  }
	  .header {
		/*font-size: 36px;*/
	}
	
	.topnav a {
		/*font-size: 40px;*/
	}
	
	
}


