/* global */

<style>
* {box-sizing:border-box}
body {font-family: Verdana,sans-serif;margin:0}
.mySlides {display:none}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

.H1{align-content: center;
}

/* The dots/bullets/indicators */
.dot {
  cursor:pointer;
  height: 13px;
  width: 13px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}
</style>



html{height: 100%;}

body
{
	font-family: gill sans, verdana, arial, sans-serif;
	padding: 0px;
	margin: 0px;
	width: 100%;
	height: 100%;
	font-size: 14px;
}

p
{
	margin: 0px;
	padding: 0px 0px 16px 0px;
	line-height: 1.7em;
	font-size: 12px;
	text-align: left;
}

h1
{ font-family: arial, sans-serif;
  letter-spacing: .1em;
}

h2
{
	margin: 0px;
	padding: 0px 0px 4px 0px;
	font-size: 100%;
	text-align: left;
}

img{border: 0px;}

a{outline: none;}

/* image positioning - left, right and center */
img.left
{ float: left; 
  padding: 0px 8px 0px 0px;
}

img.right
{ float: right; 
  padding: 0px 0px 0px 8px;
}

img.center
{ display: block;
  text-align: center;
  margin: 0 auto;
}

/* block quote */
blockquote
{ margin: 20px 0px 20px 0px; 
  padding: 10px 20px 0px 20px;
  border-left: 8px solid;
}

/* unordered list */
ul
{ margin: 8px 0px 0px 16px;
  padding: 0px;
}

ul li
{ list-style-type: square;
  margin: 0px 0px 11px 0px; 
  padding: 0px;
}

/* ordered list */
ol
{ margin: 8px 0px 0px 24px;
  padding: 0px;
}

ol li
{ margin: 0px 0px 11px 0px; 
  padding: 0px;
}

/* main container */
#container
{ width: 950px;
  height: 100%;
  margin-left: auto; 
  margin-right: auto;
}
#homeRight
{
float:left;	
 width:270px;
}
#homeRightContent
{
	width:auto;
	height:auto;
	background:#dbd9d9 url(featured.png) no-repeat;
	float:left;
	padding-top:45px;
	padding-bottom:20px;
	padding-right:0px;
	padding-left: 0px;
}

#homeRightContent table
{
	width:auto;
	height:auto;
}

#homeRightContent th
{
	width:248px;
	font-family: gill sans, verdana, arial, sans-serif;
	text-align:left;
	padding-top:10px;
	font-size:13px;
	color:#30231b;
	font-weight:lighter;
	letter-spacing:1px;
	padding-left:5px;
}

#homeRightContent td
{
	width:248px;
	font-family: gill sans, verdana, arial, sans-serif;
	font-size:11px;
	color:#30231b;
	letter-spacing:1px;
	padding-left:15px;
	padding-right:15px;
}

#homeRightContent hr
{
 width:248px;
 border-top:thin;
 border-top-color:#ce1141;
}

#menuContainer
{margin-left: auto; 
  margin-right: auto;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 0px;
  width: 856px;
  height:25px;
}

#welcome
{
 height:79px;
 width:475px;
 margin-top:10px;
 margin-bottom:15px;
 background:#f4ede0 url(welcome.png) no-repeat;
}


#chief
{
 background: #f4ede0 url( "../img/ChiefCB_v2.png") no-repeat;	
 float:right;
 width:184px;
 height:267px;
 margin-left:20px;
 margin-bottom:15px;
}

#proclaimation
{
 background: #f4ede0 url(../img/Proclaimation.png) no-repeat;	
 width:250px;
 height:167px;
}

#siteTrail
{ margin-left: auto; 
  margin-right: auto;
  padding: 4px 0px 10px 0px;
  width: 856px;
  height: 15px;
  font-size: 9px;
  background: #f4ede0;
  color: #333;
  font-family: 'Syncopate', sans-serif;
  padding-top:15px;
}

#siteTrail a
{
 color: #333;
}

#siteTrail hr
{ 
border-top-style: double;
border-top-color:#900000;
border-top-width: medium;
}

#titleBar
{
 margin-left:40px;
 font-family: gill sans, verdana, arial, sans-serif;
}
#titleBar h1
{

 font-family: gill sans, verdana, arial, sans-serif;
 font-weight:lighter;	
}
#siteTrail a:hover
{
 color:white;
 background:#900000;
}

/* links on the very top  */
#topLinks
{
	margin-left: auto;
	margin-right: auto;
	padding: 10px 10px 0px 0px;
	width: 846px;
	height: 25px;
	font-size: 94%;
	font-weight: lighter;
}

/* links in the footer  */
#contactFooter
{ margin-left: auto; 
  margin-right: auto;
  padding: 14px 0px 0px 0px;
  width: 856px;
  height: 46px;
  font-size: 94%;
}
/* links in the footer  */
#footer
{ margin-left: auto; 
  margin-right: auto;
  padding: 14px 0px 0px 0px;
  width: 856px;
  height: 46px;
  font-size: 94%;
  bottom:0;
  position:static;
  vertical-align:bottom central;
}
#banner
{ margin-left: auto; 
  margin-right: auto;
  padding: 14px 0px 0px 0px;
  width: 856px;
  font-size: 94%;
}

#topLinks{
	text-align: right;
	text-decoration: none;
	color: rgba(227,18,21,1.00);
}

#footer, #contactFooter{text-align: center;}

#topLinks a, #footer a{
}

#topLinks a:hover, #footer a:hover{text-decoration: underline;}

/* logo */
#logo
{   
    
	margin-left: auto;
	margin-right: auto;
	width: 856px;
	height: 170px;
	text-align: center;
	margin-top: 0px;
}
#logo input
{
 float:center;	
}

/* navigation menu */
#menu
{
  height:auto;
  width: 856px;
  margin-left: auto; 
  margin-right: auto;
} 

/* main content */
#content
{ margin-left: auto; 
  margin-right: auto;
  width: 856px;
  height: auto;
  padding: 0px;
  overflow: hidden;
 background: #f4ede0;
} 
#homeBottomRight
{
 width:270px;
 float:left;
 height:auto;
 margin-left:auto;
 margin-right:auto;	
}

#homeBottomRight img
{
 margin-left:auto;
 margin-right:auto;
}

#homeLeftContent h3
{
 font-family: gill sans, verdana, arial, sans-serif;
 font-size:17px;
 font-weight:normal;
 color:#3e3d3d;
}

#sign
{
 height:23px;
 width:190px;
 background:#f4ede0 url(newsign.png) no-repeat;
 padding-bottom:10px;
	
}

#homeLeftContent p
{
 font-family: gill sans, verdana, arial, sans-serif;
 font-size:14px;
 font-weight:normal;
 color:#3e3d3d; 	
}
#eventLeftContent p
{
 font-family: gill sans, verdana, arial, sans-serif;
 font-size:14px;
 font-weight:normal;
 color:#3e3d3d; 	
}

#homeLeftContent
{
 margin-left: auto;
 margin-right: auto;
 background:#f4ede0;
 width:528px;
 height:auto;
 padding-left:30px;
 padding-right:25px;
 float:left;	
}
#eventLeftContent
{
 margin-left: auto;
 margin-right: auto;
 background:#f4ede0;
 width:528px;
 height:auto;
 font-family:"Gill Sans Light", "Lucida Grande", "Myriad Web Pro", "Tekton Pro Bold", "Trajan Pro", "Trebuchet MS", Zapfino;
 font-size:18px;
 padding-left:40px;
 padding-right:25px;
 float:left;	
}

#homeLeftContent h1
{
 font-family: gill sans, verdana, arial, sans-serif;
 font-size:24px;
 font-weight:lighter;
 color:#ce1141;	
}
#eventLeftContent h1
{
 font-family: gill sans, verdana, arial, sans-serif;
 font-size:24px;
 font-weight:lighter;
 color: #630;	
}
#eventLeftContent h2
{
 font-family: gill sans, verdana, arial, sans-serif;
 font-size:18px;
 font-weight:lighter;
 color:black;	
}#eventLeftContent h3
{
 font-family: gill sans, verdana, arial, sans-serif;
 font-size:20px;
 font-weight:lighter;
 color:#630;	
}
/* bottomContent */
#bottomLeft
{
 margin-left: auto;
 margin-right: auto;
 width: 50px;
 height: 300px;
 float: left;
}
#bottomLeft table
{
display: block;
  text-align: center;
  margin: 0 auto;
 font-family: gill sans, verdana, arial, sans-serif;
width:100%;
border-collapse:collapse;

}

#bottomRight table
{
display: block;
  text-align: center;
  margin: 0 auto;
  margin-left:10px;
 font-family: gill sans, verdana, arial, sans-serif;
width:140px;
border-collapse:collapse;	
}
#bottomRight tr, td, th
{
	width:140px;
	text-align: center;
}
#livestream
{
 margin-left: auto;
 margin-right: auto;
 width: 700px;
 height: auto;
 font-family: gill sans, verdana, arial, sans-serif;
}

#bottomCenter
{
 margin-left: auto;
 margin-right: auto;
 width: 650px;
 height: auto;
 float: left;
 font-family: gill sans, verdana, arial, sans-serif;
}

#councilCommittees table{
	width: 500px;
	text-align:left;
}

#councilCommittees h1{
	background:black;
	color:white;
	font-size:24px;
	vertical-align:top;
	margin-bottom:0px;
	padding:3px;
}

#councilMeetings table{
 	width: 600px;	
}
#councilMeetings h1{
	text-align:left;	
}

#bottomCenter h1{
	font-family: 'Tangerine',"Snell Roundhand", Zapfino, "Gill Sans";
}

#bottomCenter p
{
	font-family: gill sans, verdana, arial, sans-serif;
	font-size:14px;
	font-weight:normal;
	color:#3e3d3d;
	text-align: left;
}

#bottomRight
{
	margin-left: auto;
	margin-right: 10px;
	margin-top: 40px;
	width: 140px;
	height: 300px;
	float: left;
}


#community, #community a
{
 font-family: 'Tangerine',"Snell Roundhand", Zapfino, "Gill Sans";
 font-size: 18px;
 text-decoration:none;
}

#communityCenter
{ width: 950px;
  height: 100%;
  margin-left: auto; 
  margin-right: auto;
  padding-left:30px;
  padding-right:30px;
  color:#630;
}

#communityCenter h1{
 font-family: 'Fondamento', cursive;
}

#communityCenterMedia
{ width: 950px;
  height: 350px;
  margin-left: auto; 
  margin-right: auto;
  background:white;
} 


* {box-sizing:border-box}
body {font-family: Verdana,sans-serif;margin:0}
.mySlides {display:none}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor:pointer;
  height: 13px;
  width: 13px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}