body {
	margin:0;
	padding:0px;
	text-align:center;
	background-color:#082842;
}

h1.welcome {
	font-size: 20px;
	}

h2 {
	border-bottom: 6px solid #1E6650;
	font-size: 20px;
	color: #006699;
	padding: 6px;
	margin-top: 20px;
	text-shadow:#aaa 1px 1px 1px;
	}

h3 {
	font-size: 18px;
	}

h4 {
	font-size: 14px;
	}

#main {
	margin:0px auto;
	text-align:left;
	padding:0 15px;
	max-width: 1024px;
}

#header {
	background-image: url('images/header.jpg');
    width:1024px;
    height:232px;
}

#body {
	background: transparent url('images/body.jpg') repeat-y 0 0;
    /*width:1024px;*/
    min-height:80px;
}

#body:after {
  content: "";
  display: table;
  clear: both;
}

#nav-container {
    margin: 192px auto 0 auto;
    display: inline-block;
    text-align:center;
    width: 100%;
    background: #045780 url('images/menumask_96x28.png') repeat-x 0 0;
}

#nav{
	text-shadow:#444 1px 1px 1px;
	display: inline-block;
	height:32px;
	line-height:32px;
	background: #045780 url('images/menumask_96x28.png') repeat-x 0 0;
	text-align: left;
}

#nav ul,
#nav ul li
{
	margin:0;
	padding:0;
	list-style:none;
	white-space:nowrap;
}

#nav ul li{
	border-left: 1px solid #000;
	float:left;
	display:block;
    -moz-border-radius: 0 0 8px 8px;
    -webkit-border-radius: 0 0 8px 8px;
	border-radius: 0 0 8px 8px;
	white-space:nowrap;
}
#nav ul li a:link,
#nav ul li a:visited{
	color:#FFF;
	font-size:14px;
	font-weight:bold;
	text-decoration:none;
	padding:0 10px 0 10px;
	display:block;
}
#nav ul li a:hover{
	color:#EBEFF7;
}
#nav ul li ul li{
	border: none;
	float:none;
	display:block;
}
#nav ul li ul li a:link,
#nav ul li ul li a:visited{
	color:#082842;
	text-shadow:#aaa 1px 1px 1px;
	font-weight:bold;
	text-decoration:none;
	padding:0 30px 0 10px;
	clear:both;
	border-bottom:solid 1px #DEDEDE;
    -moz-border-radius: 0 0 8px 8px;
    -webkit-border-radius: 0 0 8px 8px;
    border-radius: 0 0 8px 8px;
}
#nav ul li ul li a:hover{
	color:#3B5998;
	background:#EBEFF7;
}

.submenu {
	position: absolute;
	background: #fff;
	padding:10px;
	border:solid 1px #2E8f66;
	border-top:none;
	z-index: 1000;
	display:none;
	line-height:26px;
    -moz-border-radius: 0 0 8px 8px;
    -webkit-border-radius: 0 0 8px 8px;
    border-radius: 0 0 8px 8px;
}

#left-col {
	float: left;
	display: inline-block;
	width: 200px;
	/*padding: 8px 2px 0 8px;*/
	padding: 2px 8px 0 7px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 100%;
	/*color: #222;
	text-shadow:#aaa 1px 1px 1px;*/
	text-align: center:
}

#divider {
	float: left;
	display: inline-block;
	width: 68px;
}

#content {
	float: left;
	position: relative;
	top: 0;
	display: inline;
	padding: 4px 8px;
	max-width: 712px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 95%;
	color: #222;/*
	text-shadow:#aaa 1px 1px 1px;*/
	background-color: #fff;
	margin-bottom: -4px; /* cover footer background if smaller screen */
}




/*#content h2 {
	padding-top: 4px;
	margin-top: 4px;
}*/

#footer {
	background: #222021 url('images/footer.jpg') no-repeat 0 0;
	height:36px;
	text-align: center;
	color: #fff;
	text-shadow:#444 1px 1px 1px;
	padding-top: 12px;
	font-weight:bold;
	#font: 72.5% "Trebuchet MS", sans-serif;
	font-size: 12px;
    -moz-border-radius: 0 0 8px 8px;
    -webkit-border-radius: 0 0 8px 8px;
    border-radius: 0 0 8px 8px;
}

.external {
	background: transparent url('images/external_link.gif') no-repeat 98% 50%;
}

.rounded {
	-moz-border-radius: 8px 8px;
	-webkit-border-radius: 8px 8px;
	border-radius: 8px 8px;
	box-shadow:5px 5px 5px #000;
	-webkit-box-shadow:5px 5px 10px #000;
	-moz-box-shadow: 5px 5px 10px #000;
	margin: 0 15px 15px 15px;
}

.newsbubble {
	padding:1em; 
	background:#fff;
	text-align: center;
	-moz-border-radius: 8px 8px;
	-webkit-border-radius: 8px 8px;
	border-radius: 8px 8px;
	box-shadow:5px 5px 5px #000;
	-webkit-box-shadow:5px 5px 10px #000;
	-moz-box-shadow: 5px 5px 10px #000;
	margin: 0 15px 15px 15px;
	font-weight: bold;
	
}

.bordered {
	border-width: 1px;
	border-style: solid;
	border-color: #696969;
	border-color: #082842;
}

/* add facebook icon to left of link */	
.facebook {
	text-align: left;
	display: block;
	background: url('/images/fb_logo_small.png') no-repeat;
	padding-left: 25px;	
	}	

.pdf {
	text-align: left;
	display: block;
	background: url('/images/pdficon_small.gif') no-repeat;
	padding-left: 25px;
	/*height: 20px;*/
	margin-left: 15px;
	}
	
.meeting_box .pdf {
	margin-top: .5em;
	}	

.pdf-right {
	text-align: left;
	display: inline-block;
	background: url('/images/pdficon_small.gif') no-repeat right;
	padding-right: 25px;
	/*height: 20px;*/
	margin-right: 15px;
	line-height: 30px;
	}
	
.filesize {
	font-size: 80%;
	}	

/* page styles */


#column-one, #column-two {
	width: 45%;
	float: left;
	margin-bottom: 3em;
}

#column-one p, #column-two p {
	margin-bottom: 2em;
	}

#column-one {
	float: left;
	clear: both;
	}

#column-two {
	float: right;
	}

hr {
	clear: both;
	margin: 20px 0; }

.section-title {
	border: 1px solid #555;
	border-left: none;
	border-right: none;
	background-color: #777;
	color: #fff;
	font-weight: bold;
	text-align: center;
	padding: .4em;
	clear: both;
	margin: 20px;
	}

.center {
	text-align: center;
	}
	
.bold {
	font-weight: bold;
	}
	
q {
	font-style: italic;
	}		

/** { box-sizing: border-box; }	*/

.clear {
	clear: both;
	}
		
/* can apply this on the container to be cleared, will force to contain floats  */	

.clear-container, .gradient_box, .news_box {
	zoom:1;
	}
	
.clear-container:before,
.clear-container:after,
.gradient_box:before,
.gradient_box:after,
.news_box:before,
.news_box:after {
	content: "";
	display: block;
	overflow: hidden;
}	

.clear-container:after,
.gradient_box:after,
.news_box:after {
	clear: both;
	}	
	

#left-col #quick_links {
	clear: left;
	margin-top: 20px;
	text-align: center;
	}

#quick_links a {
	font-weight: bold;
	font-size: .9em;
	width: 160px;
	margin: .6em auto;
	text-decoration: none;
	text-align: center;
	padding: .5em;
	color: #34876F;
	color: #165A45;
	color: #fff;
	
	border: 1px solid #245f4e;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font-family: arial, helvetica, sans-serif; 
	display:inline-block;
	text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
 	background-color: #34876F; 
	background-image: -webkit-gradient(linear, left top, left bottom, from(#34876F), to(#165A45));
 	background-image: -webkit-linear-gradient(top, #34876F, #165A45);
 	background-image: -moz-linear-gradient(top, #34876F, #165A45);
 	background-image: -ms-linear-gradient(top, #34876F, #165A45);
 	background-image: -o-linear-gradient(top, #34876F, #165A45);
 	background-image: linear-gradient(to bottom, #34876F, #165A45);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#34876F, endColorstr=#165A45);
	}

#quick_links a:hover {
	/*color: #fff;*/
	
	border:1px solid #183d32;
	background-color: #318069; 
	background-image: -webkit-gradient(linear, left top, left bottom, from(#318069), to(#104233));
	background-image: -webkit-linear-gradient(top, #318069, #104233);
	background-image: -moz-linear-gradient(top, #318069, #104233);
	background-image: -ms-linear-gradient(top, #318069, #104233);
	background-image: -o-linear-gradient(top, #318069, #104233);
	background-image: linear-gradient(to bottom, #318069, #104233);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#318069, endColorstr=#104233);
	}
/*
#quick_links a.button1 {
	line-height: 40px;
	}

#quick_links a.button2 {
	line-height: 18px;
	padding-top: 2px;
	}
*/
#weather {
	text-align: center;
	}


#credit a {
	color: #ddd;
	font-weight: normal;
	}

#credit a:visited	{
	color: #ddd;
	}

#credit a:hover {
	color: #fff;
	}

/* city council page */

.council-member {
	clear: both;
	border-bottom: 2px solid #1E6650;
	padding-bottom: 2em;
	margin-bottom: 1em;
	}

.council-member:before,
.council-member:after {
    content: " ";
    display: table;
}

.council-member:after {
    clear: both;
}

.council-member h3 {
	background-color: #1E6650;
	color: #fff;
	padding: .5em;
	margin-right: 230px;
	margin-left: 0;
	margin-top: .2em;
	border-width: 1px;
	border-style: solid;
	border-color: #696969;
   -moz-border-radius: 3px 3px;
   -webkit-border-radius: 3px 3px;
   border-radius: 3px 3px;
	box-shadow:5px 5px 5px #000;
	-webkit-box-shadow:5px 5px 10px #000;
	-moz-box-shadow: 5px 5px 10px #000;
	}

.council-member h4 {
	margin: 1em 0 .5em;
	}

.council-member img {
	float: right;
	width: 200px;
	margin: 0 0 15px 15px;
	border-width: 1px;
	border-style: solid;
	border-color: #696969;
   -moz-border-radius: 8px 8px;
   -webkit-border-radius: 8px 8px;
   border-radius: 8px 8px;
	box-shadow:5px 5px 5px #000;
	-webkit-box-shadow:5px 5px 10px #000;
	-moz-box-shadow: 5px 5px 10px #000;
	}

/* description lists (used for cityoffice page) */

dl, dt, dd {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

dl {
	border: 1px solid #1E6650;
	background-color: #1E6650;
	margin-top: 0;
}

dt {
	font-weight: bold;
	padding: 0 .5em;
	background-color: #1E6650;
	background-image: url("/images/menumask_full_90x28.png");
	/*height: 28px;*/
	line-height: 28px;
	}

dd {
	margin: 0;
	padding: 5px .5em;
	margin-top: 1px;
	background-color: #fff;
	line-height: 1.3em;
	}

/* inline list - for use with only one term per list */

dl.inline {
	margin-top: 0;
	margin-bottom: 1em;
	}

dl.inline dt {
	float: left;
	clear: left;
	padding-right: 0;
	}

dl.inline dd {
	border-left: 1px solid #1E6650;
	margin: 0;
	padding: 0 .5em;
	/*height: 28px;*/
	line-height: 28px;
}

dl.short dt { width: 4em; }
dl.short dd {margin-left: 4em}

dl.med dt { width: 9.5em; }
dl.med dd {margin-left: 9.5em}

dl.long dt { width: 12.5em; }
dl.long dd {margin-left: 12.5em}


figure, figcaption {
	display: table;
	margin: 0;
	}

figcaption {
	font-weight: bold;
	font-variant: small-caps;
	text-align: center;
	color: #fff;
	padding: .5em;
	background-color: #1E6650;
	display: table-caption;
	/* border-bottom: 1px solid #082842;*/
	}


/* remove border around linked image in IE, add to anchor or other container */
.imagelink img {border: none;}

.tablelist {
		/*background-color: #1E6650;*/
	border-collapse: collapse;
	margin: 0;
	padding: 0;
	max-width: 80%;
	margin: 20px auto;
	}

.tablelist td, .tablelist th {
	border: 1px solid #1E6650;
	}

.tablelist th {
	font-weight: bold;
	font-variant: small-caps;
	padding: 2px .5em;
	background-color: #1E6650;
	background-image: url("/images/menumask_full_90x28.png");
	/*height: 24px;*/
	line-height: 24px;
}

.tablelist td {
	/*background-color: #fff;*/
	/*margin: 1px;*/
	padding: .5em;
	}

.tablelist caption {
	padding: 1em;
	font-weight: bold;
	}

/* stripe the rows */
.tablelist tbody tr:nth-child(even) {
  background: #F6F7F7;
}

.table-separator td, tfoot td {
	border: 0 none;
	height: 1em;
	padding: 0;
	}

.tablelist tfoot td {
	padding: 2em 1em;
	color: #069;
	}

.highlight {
	color: #006699;
	}


/* lists  */

/* create same in ie and ff :
l/r padding on ul, match l/r margin on li, or just set margin on li only */

ul.customlist {
	margin: 0;
	padding: 0 1em 0 .2em;
	list-style: none;
	}

ul.customlist li {
	margin: 0 1em 0 .2em;
	padding: 0;
	}

/* custom list bullet */
ul.customlist li:before {
    content: "-";
    padding-right: 5px;
}

ul.customlist.inline li {
	display: inline-block;
	width: 40%;
	}

/* pdf & minutes list */

ul.pdf {
	text-align: left;
	list-style-image: url(/images/pdficon_small.gif);
	padding: 0 15px;
	background: none;
	 }

.pdf li {
	padding-left: 10px;
	vertical-align: middle;
	margin: .5em 15px;
	font-weight: normal;
}

ul.pdf ul a {
	color: #000099;
	}

ul.pdf a:visited {
	}

ul.pdf a:hover {
	color: blue;
	}

ul.archives {
	margin-left: 30px;
	list-style-type: square;
	}

ul.archives li {
    margin: 0px 0.5em 0.8em;
    padding: 0px;
    font-weight: bold;
    list-style-type: square;
	}

ul.archives li a {
	color: #069;
	}

ul.archives li a:hover, ul.archives li a:active {
	color: #082842;
	}
	
ul.squarelist {
	list-style-type: none;
	margin: 0;
	padding: 0;
	}

ul.squarelist li {
    margin: 0px 0.5em 0.8em;
    padding: 10px 20px;
    font-weight: bold;
    list-style-type: none;
	}

ul.squarelist li a {
	color: #069;
	}

ul.squarelist li a:hover, ul.squarelist li a:active {
	color: #082842;
	}	
	
	

/* slideshow */
.slideshow {
	margin-top: 10px;
	border: 3px solid #F0E8D1;
	height: 272px;
}

/* set some basic styles in case js is turned off */
/* if js on, these will be overwritten */

.slideshow ul {
	margin: 0;
	padding: 0;
	}

.slideshow li {
    position: relative;
    float: left;
    list-style: outside none none;
    display: block;
    margin: 0px;
    width: 706px;
	 }

.slidecontent {
	padding: 10px;
	margin: 10px;
	border: 1px solid #F0E8D1;
	height: 230;
	position: relative;
	}

.slidecontent p {
	padding-bottom: 20px;
	line-height: 140%;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 10px
	}

/* text over background image, override per slide on element */
.slidecontent .phototext {
	color: #fff;
	text-shadow: 2px, 2px;
	letter-spacing: .05em;
	background:rgba(0,0,0,0.5);
	position: absolute;
	width: 100%;
	bottom: 0;
	text-align: center;
	font-size: 20px;
	float: left;
	}

.slidecontent .fullslide {
	margin: -10px;
	}

.slidecontent .img1, .slidecontent .img2, .slidecontent .img3 {
	margin: -10px;
	width: 214px;
	height: 250px;
	float: left; /* removes white space between images */
	}

.slidecontent .img1 {
	padding-right: 10px;
	border-right: 1px solid #F0E8D1;
	margin-right: 0px;
	}

.slidecontent .img2 {
	padding: 0 10px;
	margin: -10px 0px;
	}

.slidecontent .img3 {
	padding-left: 10px;
	border-left: 1px solid #F0E8D1;
	margin-left: 0px;
	}


.photoframe {
	margin: 10px auto 20px;
	text-align: center;
	}

.photoframe img {
	border: 3px solid #F0E8D1;
	padding: 10px;
	box-sizing: border-box;
	max-width: 100%; /* allow image to resize with screen */
	}

.photoframe figcaption {
	margin: 5px 0;
	border: 0 none;
	caption-side: bottom;
	}

.left {
	text-align: left;
	}

.photoframe.left img {
	float: left;
	margin-right: 1em;
	}


.painter-tribute h3 {
	text-align: center;
	}

.painter-tribute p img {
	float: left;
	margin: 0 1em 2em 0;
	}

.painter-tribute h4, .events h3, .cemeterylist h4 {
	clear: left;
	font-weight: bold;
	padding: 2px .5em;
	background-color: #1E6650;
	background-image: url("/images/menumask_full_90x28.png");
	/*height: 24px;*/
	line-height: 24px;
	margin-top: 2em;
	}

blockquote footer {
	font-size: 12px;
	display: inline;
	}

/* community events with calendar graphic */

.events h4 {
	font-size: 120%;
	text-align: center;
	margin: 1em auto;
	}

.events img.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

.events .month {
	/*float: right;*/
	margin-top: -3em;
	padding-top: 3em;
	padding-right: 170px;
	background: url("/images/calendar.png") right top no-repeat;
	min-height: 160px;
	}

.events .monthtext {
	 float: right;
    margin-right: -150px;
    width: 116px;
    text-align: center;
    margin-top: -2em;
    font-weight: bold;
    font-size: 16px;
    color: #fff;
	 font-family : Verdana, Arial, Helvetica, sans-serif;
}

/* puts a date or other text inside calendar */
/* may need to override styles for smaller text or multi-linetext */
.monthtext .date {
	display: block;
	line-height: 100px;
	color: #000;
	font-size: 34px;
	}

.monthtext .day-date {
	display: block;
	line-height: 50px;
	color: #000;
	font-size: 24px;
	}

.library_section {
	border: 1px solid #1E6650;
	border: 3px solid #F0E8D1;
	padding: 0 15px;
	margin: 20px 0;
    -moz-border-radius: 8px 8px;
    -webkit-border-radius: 8px 8px;
    border-radius: 8px 8px;
	}
	
/* cmi added styles from here */
/* news styles */

.gradient_box, .news_box {
	background: -webkit-linear-gradient(#FFFFFF, #F0E8D1); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(#FFFFFF, #F0E8D1); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(#FFFFFF, #F0E8D1); /* For Firefox 3.6 to 15 */
	background: linear-gradient(#FFFFFF, #F0E8D1); /* Standard syntax */
	padding: 10px;
	border: 3px solid #F0E8D1;
	margin-bottom: 2em;
	}
	

/* use on p inside news_box or gradient_box for city council meeting notices */	
/* 11/13/2019 replaced with box below */
.meeting_box {
	/*-moz-border-radius: 4px 4px;
	-webkit-border-radius: 4px 4px;
	border-radius: 4px 4px;
	box-shadow: 3px 3px 6px #eee;
	-webkit-box-shadow: 3px 3px 6px #eee;
	-moz-box-shadow: 3px 3px 6px #eee;
	margin: 0 auto;
	display: table;
	padding: 1em 2em;
	border: 3px solid #006699;
	background: #fff;	 
	text-align: center;
	font-weight: bold;
	line-height: 150%;	*/
}	

#left-col .meeting_box {
    -moz-border-radius: 3px 3px;
    -webkit-border-radius: 3px 3px;
    border-radius: 3px 3px;
    box-shadow: 3px 3px 6px #777;
    -webkit-box-shadow: 3px 3px 6px #777;
    -moz-box-shadow: 3px 3px 6px #777;
    margin: 1em .5em;
    display: block;
    padding: .5em;
    border: 3px solid #006699;
	 border: 3px solid #045780;
    background: #fff;
    text-align: center;
    line-height: 150%;
	 font-size: .75rem;
	 font-weight: bold;	 
}	

#left-col .meeting_box h4 {
	color:#fff; 
	margin:-.5em -.5em .7em -.4em;
	font-size: .8rem;
	padding: 2px 2px 3px;	
	font-weight:bold; 	
	
	border-bottom: 1px solid #045780;
	font-family:arial, helvetica, sans-serif; 
	text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
 	background-color: #2E8DBF; 
	background-image: -webkit-gradient(linear, left top, left bottom, from(#2E8DBF), to(#006699));
	background-image: -webkit-linear-gradient(top, #2E8DBF, #006699);
	background-image: -moz-linear-gradient(top, #2E8DBF, #006699);
	background-image: -ms-linear-gradient(top, #2E8DBF, #006699);
	background-image: -o-linear-gradient(top, #2E8DBF, #006699);
	background-image: linear-gradient(to bottom, #2E8DBF, #006699);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#2E8DBF, endColorstr=#006699);
	-webkit-box-shadow: #999 0px 1px 1px ;
	-moz-box-shadow: #999 0px 1px 1px ; 
	box-shadow: #999 0px 1px 1px ;
}
		
.gradient_box h4, .news_box h4 {
	background: #F0E8D1;
	margin: -13px -13px 1em;
	padding: 1em 4px;
	text-align: center;
	}
	
.gradient_box li, .news_box li {
	padding-bottom: 4px;
	}	
	
.news-text {
	text-align: justify;
	}	

.text_box {
	padding: .5em 1em;
	border: 3px solid #F0E8D1;
	margin: 2em;
	background: #fff;
	}
	
/* news images and figures with captions */
.news_box figure {
	margin: .5em;
	}
	
.news_box figcaption {
	margin: -15px 15px 0px 15px;
	border: 0 none;
	caption-side: bottom;
	font-weight: normal;
	font-variant: normal;
	text-align: center;
	color: #555;
	padding: .5em;
	background-color: unset;
	display: table-caption;
	font-size: 90%;	
	}

.news-img-left	{
	float: left;
	margin-right: 2em;
	}
	
.news-img-right	{
	float: right;
	margin-left: 2em;
	}	
	
.news_box .news-img-center	{
	margin: 0 auto;
	}	
	
.news_box.event-details {
	text-align: center;
	font-weight: bold;
	line-height: 150%;	
	}
	
				
/* special circumstances */

.notice, .gradient_box .notice, .news_box .notice {
	background: yellow;
	font-weight: bold;
	}	
	
.warn, .gradient_box .warn, .news_box .warn {
	background: red;
	font-weight: bold;
	color: #fff;
	}		
		
.cancelled {
	color: red;
	font-weight: bold;
	} 			

h3.eventTitle {
	color: #000080;
	}	
	
h4.notice {
	padding: 1em 4px;
	margin-top: .5em;
	text-align: center;	
	}
	
.news_box h4.notice {
	margin: -10px -10px 1em;
	border-bottom: 3px solid #F0E8D1;
}

/* need this to make pubdate work as absolute */
h4 {
	position: relative;
	}
		
.pubdate {
	font-size: .9em;
	position: absolute;
	top: 2px;
	right: 4px;
	color: black;
	font-weight: normal;
}

.footnote {
	padding-top: 1em;
	border-top: 1px solid #ada798;
	font-size: 90%;
	}