@charset "utf-8";
/* CSS Document */


body {
  margin: 0 auto;
  padding: 0;
  text-decoration: none;
  box-sizing: border-box;
  font-size: 16px;
  font-family: 'Atkinson Hyperlegible', sans-serif;
  
 
}

.dark-mode {
  background-color: black;
  color: white;
}



.uppercase {
	
	text-transform: uppercase;
	 
}


.overflow {
	overflow: hidden;
}

.primary {
	
	color: #000;
}

.burgundy {
	
	color: #4F1818;

}

.teal {
	color: #003334;
}

.peach {
	color: 	#f5c08f;
}

.wht{
	
	color: ghostwhite;

}

.ylw {
	color: #ebea9b;
}


.opac1 {
filter: opacity(10%);
}

.opac5 {
filter: opacity(50%);
}


.opac8 {
filter: opacity(80%);
}

.txtcenter {
	text-align: center;
}


a {
  color: #4F1818;
  text-decoration: none;
  background-color: transparent;
}

a:active {
    opacity: .5;
  
}


a:hover {
    opacity: .5;
  
}

a:visited {
    color: #003334;
	text-decoration: none;
  	background-color: transparent;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 1px;
  padding: 0px;
}

p {
  margin-top: 0;

}


.textj{
	text-align: justify;
}


.container {
	position: relative;
	width: 100vw;
	min-height: 100vh;
	padding-left: 5%;
	padding-right: 5%;
	background-image: linear-gradient(to bottom, rgba(200, 200, 200, 0.1), rgba(52, 146, 234, 0.22)), url("../img/talking-rock-caboose.jpg");
	background-color: #e4f2ff;
	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
	display: flex;
	justify-content: center;
	box-sizing: border-box;
	overflow: hidden;
	
}

.containerabout {
	position: relative;
	width: 100%;
	min-height: 80vh;
	padding-left: 5%;
	padding-right: 5%;
	background-image:  linear-gradient(to bottom, rgba(299, 299, 299, 0.1), rgba(52, 146, 234, 0.42)),url("../img/talking-rock-council.jpg");
	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
	display: flex;
	justify-content: center;
	box-sizing: border-box;
	overflow: hidden;
	
}






.containergov {
	position: relative;
	width: 100vw;
	min-height: 100vh;
	padding-left: 5%;
	padding-right: 5%;
	background-image:
    linear-gradient(to bottom, rgba(200, 200, 200, 0.1), rgba(52, 146, 234, 0.42)),
    url("../img/talking-rock-government.jpg");
	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
	display: flex;
	justify-content: center;
	box-sizing: border-box;
	overflow: hidden;
	
}



.containerdev {
	position: relative;
	width: 100%;
	min-height: 80vh;
	padding-left: 5%;
	padding-right: 5%;
	background-image:
    linear-gradient(to bottom, rgba(200, 200, 200, 0.15), rgba(52, 146, 234, 0.42)),
    url("../img/talking-rock-planning-development.jpg");
	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
	display: flex;
	justify-content: center;
	box-sizing: border-box;
	overflow: hidden;
	
}






.containeratr {
	position: relative;
	width: 100%;
	min-height: 80vh;
	padding-left: 5%;
	padding-right: 5%;
	background-image:
    linear-gradient(to bottom, rgba(200, 200, 200, 0.15), rgba(52, 146, 234, 0.22)),
    url("../img/talking-rock-attractions.jpg");
	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
	display: flex;
	justify-content: center;
	box-sizing: border-box;
	overflow: hidden;
}


.containerhtg {
	position: relative;
	width:  100%;
	padding-bottom: 55.89%;
  	height: 0;
  	text-align: center;
	background: #b4e3e2;
	background-image: url("../img/talking-rock-heritage-days-2026.jpg");
	background-position: top;
	background-size: contain;
  	background-repeat: no-repeat;

		
}


.containernp {
	position: relative;
	width: 100vw;
	min-height: 35vh;
	padding-left: 5%;
	padding-right: 5%;
	background-image:
    linear-gradient(to bottom, rgba(200, 200, 200, 0.2), rgba(52, 146, 234, 0.62));
	display: flex;
	justify-content: center;
	box-sizing: border-box;
	overflow: hidden;
	
	
}

	


.return {
	position: absolute;
	padding-right: 10px;
	font-family: 'Bebas Neue', cursive;
	font-size: 17px;
	background-color: #003334;
	opacity: .6;
	
}

.return img {
	height: 21px;
	color: aqua;
	padding-top: 8px;
	padding-right: 5px;
	padding-left: 5px;
	
}


.return a {
	color: #e0e0e0;
	opacity: .9;
	
}


.return:hover {
	opacity: .9;
	color: #fff;
}


.alert {
	position: absolute;
	top: 40vh;
	padding: 20px;
	background-color: #A50205;
	font-size: 20px;	
	opacity: .6;
	
}

.alert h2 {
	font-family: 'Bebas Neue', cursive;
	font-size: 35px;
	text-align: center;
	letter-spacing: 10px;

	
}

.alert {
	color: #e0e0e0;
	opacity: .9;
	
}


.alert:hover {
	opacity: .9;
	color: #fff;
}


 .pdfemb {
	    display: flex;
	    align-content: center;
		justify-content: center;
        width: 100%;
	 
	    max-width: 1000px;
        aspect-ratio: 4 / 3;
	    margin: 0 auto;
    }

    .pdfemb {
        height: 100%;
		max-height: 550px;
        margin: 0;
        padding: 0;
       
    }


.htgmain {
	width: 100%;
	background: #b4e3e2;
	align-content: center;
	
	
}

.htgimgBX {
	
	display: flex;
	justify-content: center;
	
}


.htgimgBX img {
	max-width: 100%;
	height: auto;
	padding: 10px;
}


.htgnotice {
	width: 100%;
	height: 100%;
	background: #b4e3e2;
	align-content: center;
	padding: 20px;
	
}


.htgabout {
	
	
	background: #b4e3e2;
	display: flex;
	text-align: center;
	justify-content: center;
	align-content: center;
	

	
	
}

.htginfo {
	width: 100%;
	max-width: 900px;
	margin: 5px;
	padding: 5px 20px 5px 20px;
	justify-content: center;
	align-content: center;
}

.htgapp {
	width: 30%;
	
}


.htgapp h2 {
	font-weight:  100;
	font-size: 25px;
	font-family: 'Rye', cursive;
	margin-top: 50px;
	margin-bottom: 20px;
	text-align: center;

}


.htgforms {
	margin: 0 auto;
	display: flex;
	max-width: 900px;
	justify-content: space-around;
	padding: 10px;
	align-content: center;
	align-items: center;
	flex-wrap: wrap;
	text-align: center;
	
}



.htgsponsors {
	
	background: #f5c08f;
	width: 100%;
	height: 100%;
	padding: 50px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-content: center;
	align-items: center;
	font-family: 'Bebas Neue', cursive;
	
}



.htgsponsors h1 {
	font-family: 'Courgette', cursive;
	font-size: 35px;
	text-align: center;
	
}

.sponsorp {
	max-width: 1000px;
	height: 100%;
	display: flex;
	justify-content: space-between;
	text-align: center;
	column-gap: 20px;
	padding: 10px;
	font-size: 25px;
	flex-wrap: wrap;
	
}

.sponsorp img {
	
	height: 200px;
	
}


.sponsors {
	height: 100%;
	max-width: 1000px;
	display: flex;
	justify-content: space-evenly;
	text-align: center;
	column-gap: 20px;
	padding: 10px;
	font-size: 20px;
	flex-wrap: wrap;
	font-family: 'Atkinson Hyperlegible', sans-serif;
}

.sponsors img {
	
	height: 150px;
	
}

.sponsoro {
	text-align: center;
	margin: 30px;
	font-size: 20px;
	line-height: 30px;
	font-family: 'Atkinson Hyperlegible', sans-serif;
}

.sponsorh {
	width: 90%;
	text-align: center;
	background: #4F1818;
	color: #fff;
	padding: 5px;
	font-size: 25px;
	
	
	
}


		.htgpics {
			
	position: relative;
	padding: 50px;
	width:  100%;
	height: 100%;
  	text-align: center;
 
	background: #4F1818;
	background-image: url("../img/heritage-days-duck-race.jpg");
	background-position: top;
	background-size: cover;
  	background-repeat: no-repeat;	
			
			
		}
		.htgpics h2 {
		
	    background: #4F1818;
		padding: 10px;
		margin-bottom: 50px;
		font-family: 'Courgette', cursive;
		font-size: 35px;
	   text-align: center;
		
		}


		.htgp {
		display: flex;
		justify-content: space-around;
		
	
			
		}

		.htgpI {
		background: #FFF6BB;
		padding: 5px;
		width: 30%;
		margin-bottom: 20px;
}

		.htgpI img {
		padding: 20px;		
   		max-height: 300px;
		
			
		}

		.htgpI h3 {
		background: #4F1818;
	color: #DEF1F3;
	padding: 5px;
	font-family: 'Bebas Neue', cursive;
	text-align: center;
			margin-bottom: 5px;
	
}



.htgsch {
	background: #0a4748;
	color: #DEF1F3;
	padding: 50px;
	font-family: 'Bebas Neue', cursive;
	text-align: center;
	
	
}


.htgsch h1 {
		font-family: 'Courgette', cursive;
	font-size: 35px;
	text-align: center;
	
}

.htgsch .dthd {
	margin: 0 auto;
	background: #f5c08f;
	color: #000000;
	padding: 5px;
	border-radius: 15px;
	text-align: center;
	display: flex;
	justify-content: center;
 	max-width: 200px;
	}


.htgsch  p {
		
	font-size: 20px;
	text-align: left;
	
	
}


.htgsch .htgschd {
	
	display: flex;
	justify-content: center;
	align-content: center;

	column-gap: 50px;
	padding: 10px;
	
}




.logo
{
	max-width: 220px;
	cursor: pointer;
	animation: zoomin 1s linear 1;
	animation-delay: 1s;
	visibility: hidden;
	animation-fill-mode: forwards;
	margin: 10px;
	z-index: 20;
	
}




@keyframes zoomin{
	0% {
		transform: scale(0.5);
		visibility: visible;
	}
	100% {
		transform: scale(1);
		visibility: visible;
	}
}





.navbar {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	}


#trigger  {
	position: absolute;
	top: -200px;
}


.trigger  img  {
	display: none;
	
	
}







nav {
	max-width: 800px;
	max-height: 60px;
	flex: 1;
	align-content: center;
	justify-content: center;
	margin-top: 25px;
	background:linear-gradient(.25turn, #fff 0 60%, #c6c6c6 90% 40%);
	border-radius: 30px;
	box-shadow: 0 25px 10px -15px rgba(0,0,0, 0.4);
	opacity: .8;
	animation: movedown 1s linear 1;
	animation-delay: 2s;
	visibility: hidden;
	animation-fill-mode: forwards;
}

@keyframes movedown{
	0% {
		transform: translateY(-100px);
		visibility: visible;
	}
	100% {
		transform: translateY(0);
		visibility: visible;
	}
}


nav ul li {
	list-style: none;
	display: inline-block;
	text-decoration: none;
	color: #777;
	padding: 5px;
	align-items: center;
	font-family: 'Atkinson Hyperlegible', sans-serif;
	
	cursor: pointer;
	position: relative;
	z-index: 2;
	transition: color 0.5s;
}

nav ul li::after{
	content: "";
	background:#4F1818;
	width: 100%;
	height: 100%;
	border-radius: 30px;
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
	opacity: 0;
	transition: top 0.5s, opacity 0.5s;
}

nav ul li a{
	color: #003334;
	position: relative;
	padding: 5px;
	font-size: 15px;
	font-weight: 600;
}



nav ul li a:hover{
	color: #fff;
	
}

nav ul li:hover::after{
	top: 50%;
	opacity: 1;
	
	
}


.tagb {
	
  	justify-content: center;
  	align-items: center;
	position: absolute;
	margin-bottom: 20px;
	bottom: 0;
	
	

}



.tagb h3{
	
	text-align: center;
	font-size: 30px;
	font-family: 'Anton', sans-serif;
	font-weight: 100;
	text-shadow: 2px 2px 4px #fff;
	animation: moveright 1s linear 1;
	animation-delay: 3s;
	visibility: hidden;
	animation-fill-mode: forwards;
}


.tagb h4{
	display:block;
	text-align: center;
	font-size: 25px;
	text-shadow: 2px 2px 4px #fff;
	animation: moveup 1s linear 1;
	animation-delay: 5s;
	visibility: hidden;
	animation-fill-mode: forwards;
}


.tagw {
	
  	justify-content: center;
  	align-items: center;
	position: absolute;
	margin-bottom: 20px;
	bottom: 0;
	
	

}


.tagw h3{
	
	text-align: center;
	font-size: 30px;
	color: #fff;
	font-family: 'Anton', sans-serif;
	font-weight: 100;
	text-shadow: 2px 2px 4px #000;
	animation: moveright 1s linear 1;
	animation-delay: 3s;
	visibility: hidden;
	animation-fill-mode: forwards;
}


@keyframes moveright{
	0% {
		transform: translateX(-100px);
		visibility: visible;
	}
	100% {
		transform: translateX(0);
		visibility: visible;
	}
}



@keyframes moveup{
	0% {
		transform: translateY(100px);
		visibility: visible;
	}
	100% {
		transform: translateY(0);
		visibility: visible;
	}
}


.tagnp {
	
  	justify-content: center;
  	align-items: center;
	position: absolute;
	margin-bottom: 30px;
	bottom: 0;
	
	

}



.tagnp h3{
	
	text-align: center;
	font-size: 30px;
	font-family: 'Anton', sans-serif;
	font-weight: 100;
	text-shadow: 2px 2px 4px #fff;
	animation: moveright 1s linear 1;
	animation-delay: 3s;
	visibility: hidden;
	animation-fill-mode: forwards;
}



.pghd {
	
  	justify-content: center;
  	align-items: center;
	position: absolute;
	margin-top: 200px;
	
	

}



.pghd h3{
	
	text-align: center;
	font-size: 30px;
	font-family: 'Anton', sans-serif;
	font-weight: 100;
	text-shadow: 2px 2px 4px #fff;
	animation: moveright 1s linear 1;
	animation-delay: 1s;
	visibility: hidden;
	animation-fill-mode: forwards;
	margin-bottom: 20px;
}

.pghd p{
	
	
	font-size: 16px;
	font-family: 'Atkinson Hyperlegible', sans-serif;
	

}


.about {
	
	background:  #ebea9b;
	width: 100%;
	padding:  30px;

	display: flex;
	justify-content: space-between;
	align-items: center;
	
}

.about .contentBx {
	max-width: 60%;
	margin: 50px;
	font-size: 18px;
	text-align: justify;
	
}





.about .imgBx {
	max-width: 40%;
	margin: 5px;
	
}

.about .imgBx img {
	max-width: 100%;
	border-radius: 30px;
}



.mainhd {
	font-family: 'Patua One', cursive;
	font-size: 36px;
	color: #fff;
	margin: 10px;
	font-weight: 100;
	letter-spacing: 4px;
	opacity: .7;

	}


.notice {
    background:#EDEDED;
	
	margin: 0px 25% 100px;
	font-family: 'Patua One', cursive;
	padding: 50px;
	opacity: .8;
	border:double #fff 5px;
	box-shadow: 0 25px 15px -5px rgba(0,0,0, 0.4);
}





.events {
	background: #003334;
	padding:  50px;
	text-align: center;
	
}

.events .evcontainer {
	width: 100%;
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-wrap: wrap;
	
	margin-top: 50px;
	margin-bottom: 50px;
	
}

.events .evcontainer .evCard {
	position: relative;
	background: #fff;
	width:  300px;
	height: 350px;
	display: flex;
	justify-content: center;
	align-items: center;
	transform-style: preserve-3d;
	transition: all 0.5s ease;
	border-radius: 30px;
	box-shadow: 0 25px 10px -15px rgba(0,0,0, 0.4);
	margin-bottom: 20px;
	
	
}

.events .evcontainer .evCard:hover {
	transform: rotateY(180deg);
	
	
}

.events .evcontainer .evFront {
	position: absolute;
	width: 100%;
	height: 100%;
	backface-visibility: hidden;
	background: #000;
	color: aqua;
	border-radius: 30px;

	
}

.events .evcontainer .evFront img {
position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 30px;

	
}

.events .evcontainer .evBack {
	position: absolute;
	width: 100%;
	height: 100%;
	backface-visibility: hidden;
	background:  #4F1818;
	color: #fff;
	transform: rotateY(180deg);
	border-radius: 20px;
	padding: 10px;

}


.events .evcontainer .evBack a {

	color: #ebea9b;
	


}


.events .evcontainer .evBack a:hover {
	opacity: .5;

}


.events .evcontainer .evBack h2 {
	font-weight:  100;
	font-size: 25px;
	color: #fff;
	font-family: 'Rye', cursive;
	margin-top: 30px;
	margin-bottom: 20px;

}










.invert {
	filter: invert(1);
}


.button {
  display: inline-block;
  padding: 3px 3px;
  font-size: 13px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #003334;
  background-color: #ebea9b;;
  border: none;
  border-radius: 15px;
  box-shadow: 5px -5px 20px 5px rgba(155,145,155, 0.4);
}

.button:hover {
	opacity: .5;
}

.button:active {
  background-color: #003334;
  
  transform: translateY(4px);
}




.qlinks {
	
	background:  #ebea9b;
	padding:  30px;
	text-align: center;
	
}


.qlinks .imgBx {
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-wrap: wrap;
	margin: 5px;
	font-family: 'Patua One', cursive;
	font-size: 20px;
	
	

}

.qlinks .imgBX p {
	
	align-content: center;
	padding-bottom: 20px;
}

.qlinks .imgBx img {
	max-width: 150px;
	margin: 20px;
	opacity: 0.25;
	cursor: pointer;
	
}

.qlinks .imgBx a 
{
	color: #4F1818;
}


.qlinks .imgBx a:hover
{
	opacity: .5;
}

.nopic {
	display: flex;
	background:  #ebea9b;
	padding:  50px;
	text-align: justify;
	margin: 0; 
	align-content: center;
	justify-content: center;
}


.nopic  .imgBx {
	display: flex;
	max-width: 800px;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	margin: 5px;
	font-family: 'Atkinson Hyperlegible', sans-serif;
	font-size: 16px;
	

}

.nopic  .imgBX p {
	
	align-content: center;
	padding-bottom: 20px;
	text-align: justify;
}

.nopic  .imgBx img {
	max-width: 150px;
	margin: 20px;
	opacity: 0.25;
	cursor: pointer;
	
}

.nopic  .imgBx a 
{
	color: #4F1818;
}

.subhd  {
	padding: 10px;
	background-color: #4F1818;
	font-family: 'Anton', sans-serif; 
	font-size: 16px;
	color:  #fff;
    border-radius: 30px;
	
	width: 350px;
	text-align: center;
	margin-left: 30%;
	margin-right: 30%;
}


.nopic  .imgBx a:hover
{
	opacity: .5;
}






.council {
	background: #003334;
	padding:  30px;
	text-align: center;
	justify-content: center;
	align-content: center;
	
	
}


.council h2 {
	font-weight:  100;
	font-size: 25px;
	color: #fff;
	font-family: 'Rye', cursive;
	margin-top: 30px;
	margin-bottom: 20px;

}


.council .cncontainer {
	max-width: 100%;
	
	display: flex;
	justify-content:space-around;
	
	flex-wrap: wrap;
	
	padding: 50px;

	
}

.cnCard {
	position: relative;
	background: #000;
	width:  375px;
	height: 485px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 30px;
	box-shadow: 0 30px 30px rgba(0,0,0, 0.5);
	margin-bottom: 50px;

}

 .cnCard .imgbx {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

}




 .cnCard .imgbx img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: 0.5s;
	border-radius: 30px; 

}

 .cnCard:hover  img {
	opacity: 0;
	 

}

 .cnCard imgBx {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

}


.cnCard  .cncontent {
	position: absolute;
	bottom: 20px;
	left: 10%;
	width: 80%;
	height: 80px;
	background: #fff;
	transition: 0.5s;
	overflow-y: scroll;
	
	padding: 15px;
	box-sizing: border-box;
	
	
}


.cnCard  .cncontent::-webkit-scrollbar {
		 width: 7px; 
		
	}

.cnCard:hover .cncontent {
	
	width: 100%;
	height: 100%;
	bottom: 0;
	left: 0;
	border-radius: 30px;
}

.cnCard  .cncontent h3 {
	margin: 0;
	padding: 0;
	font-size: 20px;
	font-weight: 200;

}

.cnCard  .cncontent h4 {
	margin: 0;
	padding: 0;
	font-size: 14px;
	font-weight: 100;

}

.cnCard  .cncontent p {
	margin: 10px 0 0;
	padding: 0;
	opacity: 0;
	line-height: 1.2em;
	transition: 0.5s;
	text-align: justify;
	

}

.cnCard:hover  .cncontent p {
	opacity: 1;
	

}


.townclerk {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	
}




.townclerk .contentBx{
	background:  #b3aa87;
	padding:  30px;
	width:  40%;
	
	
}




.townclerk .contentBx h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 10px;
	margin-bottom: 40px;
	text-align: center;

}

.townclerk .contentBx .text{
	color:  #000;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 1px;
	text-align: justify;
}




.townclerk .MinuteBx {
	background-color:  #edead0;
	width: 60%;
	padding:  30px;
	
	
  
}





.townclerk .MinuteBx h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 10px;
	margin-bottom: 40px;
	text-align: center;

}


.townclerk .MinuteBx .minutes {
	display: flex;
	flex-wrap: wrap;
	padding: 20px;
	justify-content: space-around;


	
}

.townclerk .MinuteBx .minutes>* {
	flex: 1 1 120px;


	
}



.history {
	position: relative;
	width: 100%;
	display: flex;
	
}

.history .contentBx{
	background: #8197a4;
	padding:  50px;
	width:  50%;
}

.history h2 {
	font-weight:  100;
	font-size: 25px;
	
	font-family: 'Rye', cursive;
	margin-top: 50px;
	margin-bottom: 20px;
	text-align: center;

}


.history .imgBx {
	background: url("../img/talking-rock-map-1883.jpg");
	width: 50%;
	background-size: cover;
	background-position: center;
	
  
}



.calendar {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	background-color: #a6dbff;
background-image:
    linear-gradient(to bottom, rgba(200, 180, 180, 0.15), rgba(52, 146, 234, 0.62)),
    url("../img/calendar-blue.png");
	background-position: top;
background-repeat: repeat-x;
	box-sizing: border-box;
	overflow: hidden;
	
		
}





.AgendaBx{
	
	
	
	padding:  30px;
	width:  60%;
	
	

	
}




.agenda {
	background:linear-gradient(.55turn, #fff 0 60%, #a6dbff 90% 40%);
	border-radius: 30px;
	box-shadow: 0 25px 10px -15px rgba(0,0,0, 0.4);
	min-height: 550px;
	opacity: .8;
	width: 90%;
	margin-left: 35px;
	padding: 10px;
	margin-top: 20px;
	
	
}


.calendar .AgendaBx h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 50px;
	margin-bottom: 40px;
	text-align: center;
	
}








.calendar  .YtBx {
	
	width: 40%;
	padding-top: 50px;
    margin-top: 10%;
	
  
}





.calendar .YtBx h2 {
	font-weight:  100;
	font-size: 20px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 30px;
	margin-bottom: 20px;

}


.yt {
	 position: relative;
	 background: transparent;
	 padding-bottom: 56.25%;
	 padding-top: 20px;
	 height: 0;
	 overflow: hidden;
	 margin-bottom: 25px;
	
	  }
	  
	  	 
.yt iframe 
{ 
 	position: absolute;
 	top: 0;
 	left: 0px; 
	margin: 20px;
 	width: 90%;
  	height: 90%;
    
   }



.directory {
	position: relative;
	width: 100%;
	min-height: 100vh;
	background: #4F1818;
	padding:  10px;
	text-align: center;
}

.directory .dcontainer {
	width: 100%;
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 30px;
	margin-bottom: 30px;
	
}

.directory .dcontainer .dCard {
	position: relative;
	background: #000;
	width:  400px;
	height: 400px;
	
	justify-content: center;
	align-items: center;
	border-radius: 30px;
	box-shadow: 0 25px 10px -15px rgba(0,0,0, 0.4);
	margin-bottom: 20px;
	color: #fff;
	
}

.directory .dcontainer .dCard img {
	width: 75%;
	border: #c4e0e5 double thick;
	border-radius: 30px;
}

.directory .dcontainer .dCard a {
	color: #c4e0e5;
}


.directory .dcontainer .dCard h3 {
	font-weight:  100;
	font-size: 20px;
	color: #fff;
	font-family: 'Josefin Slab', serif;
	margin-top: 20px;
	margin-bottom: 5px;
	height: 50px;
	
	
	
}

.directory h2 {
	font-weight:  100;
	font-size: 25px;
	color: #fff;
	font-family: 'Rye', cursive;
	margin-top: 50px;
	margin-bottom: 20px;

}








.contact {
	
	background: #003334;
	width: 100%;
	padding:  50px;
	padding-top:  300px;
	margin-top: -300px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color:  #fff;
}

.contact.contentBx {
	max-width: 60%;
	
}

.contact .MapBx {
	
	max-width: 40%;
	margin: 50px;
	display: flex;
	justify-content: center;
	
}


.contact .MapBx iframe 
{ 
 
 	
	width: 500px;
  	height: 400px;
    
   }

.contact h2 {
	font-weight:  100;
	font-size: 25px;
	color: #fff;
	font-family: 'Rye', cursive;
	margin-top: 50px;
	margin-bottom: 20px;
	text-align: center;

}



.ordinances {
	background: #003334;
	padding:  30px;
	text-align: center;
	justify-content: center;
	align-content: center;
	color: #fff;
	
	
	
}

.ord {
	margin: 50px;
	
	
	
}


.ordinances h2 {
	font-weight:  100;
	font-size: 25px;
	color: #fff;
	font-family: 'Rye', cursive;
	margin-top: 30px;
	margin-bottom: 20px;
   padding: 10px;
}


.ordinances a {
	color: #ebea9b;

}

.ordinances a:hover {
	opacity: .5;

}



.notices {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	
}




.notices .noticeBx{
	background:  #9cc7da;
	padding:  30px;
	width:  50%;
	
	
}




.notices .noticeBx h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 10px;
	margin-bottom: 40px;
	text-align: center;

}

.notices .noticeBx .text{
	color:  #000;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 1px;
	text-align: justify;
}




.notices .bidBx {
	background-color:  #b9e6fa;
	width: 50%;
	padding:  30px;
	
	
  
}


.notices .bidBx h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 10px;
	margin-bottom: 40px;
	text-align: center;

}

.notices .bidsBx .text{
	color:  #000;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 1px;
	text-align: justify;
}



.finance {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-color: #b3aa87;
    background: linear-gradient(to bottom, rgba(207, 204, 190, 0.99), rgba(179, 170, 135, 0.89));
	padding: 10px;


	
		
}

.finance img {
	max-width: 100%;
	height: auto;
	margin: 10px;
	
}

.finance h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
    padding: 20px;
	text-align: center;

	
		
}

.finance .fin {
	display: flex;
	justify-content: space-around;
	padding: 20px;
	


	
}

.build {
	position: relative;
	width: 100%;
	height: 100%;
	background: #003334;
	color: #fff;
	padding:  30px;
	text-align: center;
	
	
}


.build h2 {
	font-weight:  100;
	font-size: 25px;
	color: #fff;
	font-family: 'Rye', cursive;
	margin-top: 30px;
	margin-bottom: 20px;
   padding: 10px;
}


.build h4 {
	font-weight:  300;
	font-size: 25px;
	color: #fff;
	font-family: 'Anton', sans-serif; 
	margin-top: 30px;
	margin-bottom: 20px;
   padding: 5px;
}

.build p {
	
   padding: 5px;
}
.build a {
	color: #ebea9b;

}


.build a:hover {
	opacity: .5;

}


.build .colc34 {
	
	width: 100%;
	display: flex;
	justify-content: space-around;

	flex-wrap: wrap;
	margin: 10px;
	
}

.build .colc34 h3{
	
	padding: 10px;
	background-color: #014849;
	border-radius: 30px;
	margin-bottom: 20px;
	
}



.build .colc34 .bfees{
	
	top: 0;
	max-width: 70%;
	
}



.build .colc34 .bforms {
	

	max-width: 30%;
	top: 0;
	
	
	
  
}



.affad {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 100px;
	background-color: #b3aa87;
	background: linear-gradient(to bottom, rgba(207, 204, 190, 0.99), rgba(179, 170, 135, 0.89))
}





.affad h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 10px;
	margin-bottom: 40px;
	text-align: center;

}

.affad p {
	font-weight:  600;
	font-size: 20px;
	

}


.zone {
	position: relative;
	width: 100vw;
	min-height: 100%;
	
	background: linear-gradient(to bottom, rgba(200, 200, 200, 0.1), rgba(52, 146, 234, 0.32)),
    url("../img/zoning.jpg");
	background-position: center;
  	background-repeat: no-repeat;
  	background-size: cover;
	display: flex;
	justify-content: center;
	box-sizing: border-box;
	overflow: hidden;
	padding:  30px;
}

.zone h2 {
	font-weight:  100;
	font-size: 25px;
	color: #003334;
	font-family: 'Rye', cursive;
	margin-top: 30px;
	margin-bottom: 20px;
   padding: 10px;
}


.zone h4 {
	font-weight:  300;
	font-size: 25px;
	color: #003334;
	font-family: 'Anton', sans-serif; 
	margin-top: 30px;
	margin-bottom: 20px;
   padding: 5px;
}

.zone p {
	
   padding: 5px;
   font-weight: bold;
}



.zone a {
	color: #4F1818;

}

.zone .colc34 {
	
	width: 100%;
	display: flex;
	justify-content: space-around;

	flex-wrap: wrap;
	margin: 10px;
	
}





.zone .colc34 .zord{
	
	top: 0;
	max-width: 70%;
	
}



.zone .colc34 .formsz {
	

	max-width: 30%;
	top: 50px;
	
	
}

.zone .colc34 .formsz p {
	

	font-size: 18px;
	font-weight: bold;
	
	}



.biz{
	position: relative;
	width: 100%;
	height: 100%;
	padding: 100px;
	background-color: #4F1818;
	
}





.biz h2 {
	font-weight:  100;
	font-size: 25px;
	color: #fff;
	font-family: 'Rye', cursive;
	margin-top: 10px;
	margin-bottom: 40px;
	text-align: center;

}

.biz h3 {
	
	font-size: 20px;
	color: #fff;
	margin-top: 10px;
	text-align: center;
	margin-bottom: 20px;

}

.biz p {
	font-weight:  600;
	font-size: 22px;
	color: #fff;
	

}

.biz a {
	font-weight:  600;
	font-size: 18px;
	color: #ebea9b;
	

}


.biz a:hover {
	opacity: .5;

}



.alcohol {
	position: relative;
	width: 100%;
	height: 100%;
	background: #a6dbff;
	color: #fff;
	padding:  30px;
	text-align: center;
	
	
}
.alcohol .content {
	
	width: 100%;
	display: flex;
	justify-content: center;
	align-content: center;
    flex-wrap: wrap;
	
	margin: 10px;
	
}

.alcohol h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 30px;
	margin-bottom: 20px;
   padding: 10px;
}


.alcohol h3{
	
	padding: 10px;
	background-color: #3c8cc3;
	border-radius: 30px;
	margin: 0px 20% 20px 20%;
	
	
	
}


.alcohol h4 {
	font-weight:  300;
	font-size: 18px;
	color: #000;
	font-family: 'Anton', sans-serif; 
	margin: 5px;
 
}

.alcohol p {
	
   padding: 5px;
}


.alcohol .checklist {
	text-align: justify;
	
	color: #000;
}


.alcohol table {
	max-width: 500px;
	padding: 5px;
	
	color: #000;
}

.alcohol table td {
	padding: 10px;
}


.alcohol a {
	color: #4F1818;

}


.alcohol a:hover {
	opacity: .5;

}





.park {
	position: relative;
	width: 100%;
	height: 100%;
	color: #fff;
	display: flex;
	background:  #003334;
}




.park .contentBx{
	background:  #003334;
	padding:  15px;
	width:  50%;
}

.park h2 {
	font-weight:  100;
	font-size: 25px;
	
	font-family: 'Rye', cursive;
	margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;

}

.park h3{
	font-weight:  100;
	font-size: 18px;
	
	font-family: 'Rye', cursive;
	margin-bottom: 10px;
	text-align: center;

}

.park h4 {
	font-weight:  500;
	font-size: 18px;
	
	padding: 10px;
	text-align: center;

}



.park .imgBx {
	background-image:  url("../img/trpark3.jpg");
	width: 50%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
    animation: imgs 30s linear infinite;
	animation-delay: .5s;
  	animation-fill-mode: forwards;
}

@keyframes imgs {
    0%{
        background-image:  url("../img/trpark3.jpg");
    }
    20%{
        background-image:  url("../img/trpark1.jpg");
    }
    60%{
        background-image:  url("../img/trpark2.jpg");
    }
	80%{
        background-image:  url("../img/trpark4.jpg");
    }

}




.park a {
	color: #ebea9b;

}

.park a:hover {
	opacity: .5;

}
	

.smtx {
	
	font-size: 15px;
	line-height: 14px;
}


.commroom {
	position: relative;
	width: 100%;
	display: flex;
	background-color: #b3aa87;
	background: linear-gradient(to bottom, rgba(207, 204, 190, 0.99), rgba(179, 170, 135, 0.89))
}





.commroom h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 50px;
	margin-bottom: 40px;
	text-align: center;

}

.commroom h4 {
	font-weight:  500;
	font-size: 18px;
	
	padding: 10px;
	text-align: center;

}


.commroom .imgBx {
	background-image:  url("../img/communityroom.jpg");
	width: 50%;
	background-size: cover;
	background-position: center;
    min-height: 540px;

  
}

.commroom .contentBx{
	
	padding:  15px;
	width:  50%;
	align-content: center;
	align-items: center;
}


.school {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 30px;
	background-color: #b3aa87;
	 background: linear-gradient(to bottom, rgba(200, 180, 180, 0.15), rgba(52, 146, 234, 0.62));
		
}


.school h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 10px;
	margin-bottom: 20px;
	text-align: center;

}

.school .colc34 {
	
	width: 100%;
	display: flex;
	justify-content: space-around;

	flex-wrap: wrap;
	
	
}
.school .colc34 .schoolct{
	

	max-width: 70%;
	top: 50px;
	
	
}






.school .colc34 .schooltm{
	

	max-width: 30%;
	top: 50px;
}

	.school img {	
	border-radius: 30px;
	}	

	.school img {	
	border-radius: 30px;
	}	




.mural{
	position: relative;
	width: 100%;
	height: 100%;
	padding: 30px;
	background-color: #b3aa87;
	
}





.mural h2 {
	font-weight:  100;
	font-size: 25px;
	color: #000;
	font-family: 'Rye', cursive;
	margin-top: 10px;
	margin-bottom: 40px;
	text-align: center;

}


	.mural img {	
	border-radius: 30px;
	max-width: 800px;
	}	


.mural .colc34 {
	
	width: 100%;
	display: flex;
	justify-content: space-around;

	flex-wrap: wrap;
	
	
}
.mural .colc34 .murall{
	

	max-width: 60%;
	top: 50px;
	padding: 10px;
	
}






.mural .colc34 .muralr{
	

	max-width: 40%;
	top: 100px;
	padding: 50px;
	
}









.footer {
	background: rgb(128,150,164);
background: -webkit-linear-gradient(210deg, rgba(128,150,164,1) 11%, rgba(255,255,255,1) 76%, rgba(255,255,255,1) 100%, rgba(234,235,244,1) 100%, rgba(76,87,188,1) 100%, rgba(255,255,255,1) 100%);
background: -o-linear-gradient(210deg, rgba(128,150,164,1) 11%, rgba(255,255,255,1) 76%, rgba(255,255,255,1) 100%, rgba(234,235,244,1) 100%, rgba(76,87,188,1) 100%, rgba(255,255,255,1) 100%);
background: linear-gradient(300deg, rgba(128,150,164,1) 11%, rgba(255,255,255,1) 76%, rgba(255,255,255,1) 100%, rgba(234,235,244,1) 100%, rgba(76,87,188,1) 100%, rgba(255,255,255,1) 100%);
	padding: 20px 100px;
	
	display: block;
	justify-content: space-between;
	align-items: center;
}

.footer p {
	color: #003334;
	font-family: 'Bebas Neue', cursive
}

.footer ul {
	display: flex;
	justify-content: center;
	align-items: center;
	
}

.footer ul li {
	list-style: none;
}

.footer ul li a {
	text-decoration: none;
	display: inline-block;
	margin: 0 10px;
}

.footer ul li a  img{
	filter: invert(1);
	max-width: 20px;
	
}

.social  img{
	filter: invert(1);
	max-width: 30px;
	justify-content: center;
	
}



.copyright {
	font-size: 12px;
	text-align: center;
	color: darkgray;
}










@media only screen and (max-width: 1075px)
	
{

	

		
.container {
	width: 100vw;
	min-height: 100%;
	padding-bottom: 40.89%;
	background-position: top;
	background-size: contain;


	
}
	
.containerabout {
	width: 100vw;
	min-height: 100%;
	padding-bottom: 40.89%;
	background-position: top;
	background-size: contain;


	
}	
	
.containergov {
	width: 100vw;
	min-height: 100%;
	padding-bottom: 40.89%;
	background-position: top;
	background-size: contain;


	
}	
	
.containerdev {
	width: 100vw;
	min-height: 100%;
	padding-bottom: 20.89%;
	background-position: top;
	background-size: contain;


	
}	
	
.containeratr {
	width: 100vw;
	min-height: 100%;
	padding-bottom: 30.89%;
	background-position: top;
	background-size: contain;


	
}	
	
	

.tagb h3{
	
	
	font-size: 20px;

}
	
.tagb h4{

	font-size: 18px;

}	


nav {
	max-width: 50px;
	max-height: 50px;
	flex: 1;
	align-content: center;
	justify-content: center;
	margin-top: 25px;
	margin-left: 5px;
	background:linear-gradient(.25turn, #fff 0 60%, #c6c6c6 90% 40%);
	border-radius: 30px;
	box-shadow: 0 25px 10px -15px rgba(0,0,0, 0.4);

}	
	
	nav ul li	{
		visibility: hidden;
	}
	
	
	
.trigger {
		cursor: pointer;
		
	}

	
	
input#trigger:checked  ~ nav ul li{
   visibility: visible;
	
}


	
		
.trigger .n1 img  {
	display: flex;
	justify-content: space-around;
	width: 30px;
	margin: 9px;
	opacity: .8;
	text-shadow: 3px 5px 3 #fff;
	
	
}
	


.trigger .n2  {
	display: none;
	
	
}	
	
#trigger:checked ~ label .n1 img   {
display:none;
}
	
#trigger:checked ~ label .n2 img   {
display: block;
}	
	

nav ul li {
	list-style: none;
	width: 230px;
	display: block;
	text-decoration: none;
	color: #777;
	padding: 5px;
	text-align: center;
	font-family: 'Atkinson Hyperlegible', sans-serif;
	left: -200px;
	cursor: pointer;
	position: relative;
	z-index: 2;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0 25px 10px -15px rgba(0,0,0, 0.4);
	box-sizing: border-box;
	line-height: 30px;
	

}

nav ul li::after{
 display: none;
}

nav ul li a{
	color: #003334;
	position: relative;
	padding: 5px;
	font-size: 15px;
	font-weight: 600;
}



nav ul li a:hover{
	color: #4F1818;
	opacity: .9;
	
}

nav ul li:hover::after{

	
	
}
	
.subhd  {

	margin-left: 10%;
	margin-right: 10%;
}	


.about {
	
	background:  #ebea9b;
	width: 100%;
	

	display: block;
	align-items: center;
	
}

.about .contentBx {
	max-width: 90%;
	margin: 10px;
	font-size: 18px;
	text-align: justify;
	padding:  15px;
}





.about .imgBx {
	max-width: 100%;
	margin: 5px;
	align-content: center;
	padding-left: 10%;
	padding-right: 10%;
	
}



	
	
		
.history {
	display: block;
	
}
		
.history .contentBx{
	background: #8197a4;
	padding:  15px;;
	width:  100%;
}
		
.history .imgBx {
	
	width: 100%;
	height: 500px;
	
  
}		
		
.townclerk {
	display: block;
	
}	
	

		

.townclerk .contentBx,
.townclerk .MinuteBx{
	padding:  15px;
	width:  100%;
	height: 100%;
}
	


		
.calendar{
	display: block;
	
}			
		

.calendar .AgendaBx
 {
	width:  100%;
	padding:  15px;
}


.calendar  .YtBx {
	
	width: 100%;
	padding-top: 50px;

	
  
}
.contact {
	

	padding:  15px;
	padding-top: 5px;
	margin-top: 0;
 	flex-direction: column;
	justify-content: center;
}



.contact.contentBx {
	max-width: 90%;
	padding:  15px;

}

.contact .MapBx {
	
	max-width: 90%;
    padding:  15px;
	
}



		
		
		

		
.contact .MapBx iframe 
{ 
 
 	width: 250px;
  	height: auto;
	margin: auto 0;
    
   }	

	
		
	.qlinks .imgBx {
	display: flex;
	justify-content: space-around;
	align-items: center;
	flex-wrap: wrap;
	margin: 15px;
	column-gap: 50px;
	font-family: 'Patua One', cursive;
	font-size: 14px;
	
		}
	
.qlinks .imgBx img {
	max-width: 50px;
	margin: 20px;
	opacity: 0.25;
	cursor: pointer;
	
}
		
		

	
.ordinances {
	
	padding:  15px;
	
	
}	
	
.notices {
	flex-direction: column;
	
}	
	
	
.notices .noticeBx,
.notices .bidBx{
	padding:  15px;
	width:  100%;
	height: 100%;
}	

	
.finance .fin {
	display: block;
	padding:  15px;
		
}

		.htgpics {
			
	
	padding: 20px;

			
			
		}
	
	
	
		.htgp {
		display: block;
		
		
	
			
		}

		.htgpI {
		width: 100%;
		height: auto;
		margin-bottom: 20px;
}

		.htgpI img {
		max-width: 100%;
		height: auto;
}
	
	.footer {
		padding: 10px;
	

}
	
.affad{

	padding:  15px;
	
	
}	
	

.biz{

padding:  15px;
	
	
}	
	
.park {

	flex-direction: column;
   
}
	




.park .contentBx{
	
	width:  100%;
	padding:  15px;
}



.park .imgBx {

	width: 100%;
	height: 500px;

  
}	
	
	
		
.school {

	padding: 15px;


}		
		
	
.school .colc34 {
	
	display: block;
		}


.school .colc34 .schoolct{
	

	max-width: 100%;
	padding: 15px;
}



.school .colc34 .schooltm {
	

	max-width: 100%;
	 padding: 15px; 
}	
		
		.school img {
			width: 90%;
			height: auto;
			
		}
	
	
.commroom {
	display: block;
	

}
	
.commroom h2 {

	margin-top: 20px;
	margin-bottom: 20px;


}	


.commroom .imgBx {
	background-image:  url("../img/communityroom.jpg");
	width: 100%;
	height: auto;

  
}

.commroom .contentBx{
	
	
	width:  100%;

	align-items: center;
}
			


.mural{

	padding: 15px;

}



	.mural img {	
	border-radius: 30px;
	max-width: 400px;
	}	


.mural .colc34 {
	

	display: block;
	
	
}
.mural .colc34 .murall{
	

	max-width: 100%;
	top: 10px;
	padding: 15px;
	
}







.mural .colc34 .muralr{
	

	max-width: 100%;
	top: 10px;
	padding: 15px;
	
}




	
	
	
	
	
	

tory .imgBx {
	
	width: 100%;
	height: 500px;
	
	}
	
}









@media only screen and (max-width: 850px)
	
	{	
		
		
.container {

	padding-bottom: 20.89%;



	
}
		
.containerabout {

	padding-bottom: 20.89%;



	
}	
		
		
.council .cncontainer {

	
	padding: 10px;

	
}		
		
		

.logo
{
	
	padding-top: 50%;
	margin: 0px;
	margin-left: 40%;
	margin-right: 40%;
	

	}	
		
		
		
		
		
	.htgabout {
	
	display: block;
	padding: 0px 10px 10px 5px;
}	
		
		
		
		
	.htginfo {
	width: 100%;
	align-content: center;
	
	margin: 1px;
}
		
		


		
		
		
		

.htgapp {
	align-content: center;
	width: 100%;

	
}	
		
		
		
		
		
	
		
.htgpics h2 {
		
	
		padding: 5px;
		font-size: 25px;
	text-align: center;
		
		}

		
		
		
	.sponsorp {
	
	display: block;
	padding: 20px;
	margin-bottom: 20px;
}	
		
.return {
	
	bottom: 0;
	margin-bottom: 5px;
	 
	
}	
		
.htgsch {

	padding: 10px;

	
	
}	
		
		

.htgsch .htgschd {
	
	display: block;
	
}		
		
	
.notice {

	
	margin: 0px 5% 30px;
	
}

		
.build .colc34 {
	
	display: block;
		}


.build .colc34 .bfees{
	

	max-width: 100%;
	
}



.build .colc34 .bforms {
	

	max-width: 100%;
	
	
	
  
}		

.zone .colc34 {
	
	display: block;
		}


.zone .colc34 .zord{
	

	max-width: 100%;
	
}



.zone .colc34 .formsz {
	

	max-width: 100%;
	
	
	
  
}	

	
		
		
}