@charset "UTF-8";

article, aside, footer, header, main, section {
	display: block;
}

* {padding:0; margin:0;}

u {
		text-decoration: none;
		}
body {
		background-size: cover;
		background-image: url("editor/images/bg1.jpg");
		background-repeat: repeat;
		background-attachment:fixed;
		-moz-background-size: cover;
		-webkit-background-size: cover;
		-o-background-size: cover;
		background-position: center center; 
				}

.header {
		
}
.header img {
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 100%;
		height: 300px;
}
.mainwrapper {
				display: grid;
				grid-template-columns: 1fr; 
				grid-template-rows: auto;
				width: 100%;
				margin-left: auto;
				grid-template-areas:
					"datebox"
					"topadbox"
					"mainnav"
					"banner1"
					"controls"
					"mainframe"
					"fbanner"
					"bottomadbox";
					
				}
.datebox {
	grid-area: datebox;
	text-align: center;
	font-size: 30px;
	color: black;
	font-weight: bold;
	
}
.topadbox {
	grid-area: topadbox;
	margin-left: auto;
	margin-right: auto;
	border: 1px solid black;
	width: 80%;
	max-width: 800px;
	margin-top: 20px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr; 
				margin-left: auto;
				margin-right: auto;
				grid-template-areas:
					"top1 top2 top3 top4"
					;
				}
.topad1 {
	grid-area:top1;
	border: 1px solid black;
	max-height:300px;
	background-color: white;
}
.topad2 {
	grid-area:top2;
	border: 1px solid black;
	max-height:300px;
	border-left: 2px solid black;
}
.topad3 {
	grid-area:top3;
	border: 1px solid black;
	max-height:300px;
		
}
.topad4 {
	grid-area:top4;
	border: 1px solid black;
	max-height:300px;
		
	
}
.topadbox img {
	width: 100%;
	height: 100%;
	min-width: 80px;	
}
.mainnav{
	grid-area: mainnav;
	margin-top: 20px;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
.topnav {
  overflow: hidden;
  background-color: black;
  border-radius: 20px;
  border: 2px solid white;
}
.topnav a {
  float: left;
  display: block;
  color: #ffffff;
  text-align: center;
  padding: 4px 6px;
  text-decoration: none;
  font-size: 17px;
  font-weight: bold;
}
.active {
  background-color: black;
  color: white;
  
}
.topnav .icon {
  display: none;
}
.dropdown1 {
  float: left;
  overflow: hidden;
}
.dropdown1 .dropbtn {
  font-size: 17px;    
  border: none;
  outline: none;
  color: white;
  padding: 4px 6px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
  font-weight: bold;
}
.dropdown-content1 {
  display: none;
  position: absolute;
  background-color:black;
  color: white;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  border: 2px solid white;
}
.dropdown-content1 a {
  float: none;
  color: white;
  padding: 4px 6px;
  text-decoration: none;
  display: block;
  text-align: left;
}
.topnav a:hover, .dropdown:hover .dropbtn {
  background-color: white;
  color: black;
}
.dropdown-content1 a:hover {
  background-color: white;
  color: black;
}
.dropdown1:hover .dropdown-content1 {
  display: block;
}
@media screen and (max-width: 600px) {
  .topnav a:not(:first-child), .dropdown1 .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
}
@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown1 {float: none;}
  .topnav.responsive .dropdown-content1 {position: relative;}
  .topnav.responsive .dropdown1 .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
}


.banner1 {
	grid-area: banner1;
	margin-top: 20px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border: 1px solid black;
	height: 152px;
	width: 80%;
	
}
.banner1 img {
	height: 150px;
	
}
.controls {
	margin-top: 20px;
	grid-area: controls;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-areas:
						"prevpage  .  nextpage";
						
}
.prevpage {
	grid-area: prevpage;
		
}
.prevpage img {
	max-height: 50px;
	max-width: 50px;
	float: right;
	margin-right: 30px;
}
.nextpage {
	
	grid-area: nextpage;
	text-align: right;
}
.nextpage img {
	max-height: 50px;
	max-width: 50px;
	float: left;
	margin-left: 30px;
}
.mainframe { 
	grid-area: mainframe;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	height: 1080px;
	margin-top: 10px;
}
.fbanner {
	grid-area: fbanner;
	border: 1px solid black;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	height: 152px;
	margin-top: 20px;
	
}
.fbanner img{
	height: 150px;
	
}
.fbanner2 {
	grid-area: fbanner;
	border: 1px solid black;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	height: 152px;
	margin-top: 0px;
	
}
.fbanner2 img{
	height: 150px;
	
}

.bottomadbox {
	grid-area: bottomadbox;
	margin-left: auto;
	margin-right: auto;
	border: 1px solid black;
	display: grid;
	width: 80%;
	max-width:800px;
	margin-top: 30px;
	grid-template-columns: 1fr 1fr 1fr 1fr; 
				margin-left: auto;
				margin-right: auto;
				grid-template-areas:
					"bot1 bot2 bot3 bot4"
					;
				}
.bottomad1 {
	grid-area:bot1;
	border: 1px solid black;
	max-height:300px;
	
}
.bottomad2 {
	grid-area:bot2;
	border: 1px solid black;
	max-height:300px;
	
	
}
.bottomad3 {
	grid-area:bot3;
	border: 1px solid black;
	max-height:300px;
		
}
.bottomad4 {
	grid-area:bot4;
	border: 1px solid black;
	max-height:300px;
		
	
}
.bottomadbox img {
	width: 100%;
	height: 100%;
	min-width: 80px;	
}
footer {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	grid-area: footer;
	text-align: center;
	font-size: 20px;
	border: medium ridge white;
	background-color:black;
	margin-top: 20px;
	color: white;
}



.contactwrapper {
				display: grid;
				grid-template-columns: 1fr ; 
				grid-gap: 3px;
				grid-template-rows: auto;
				width: 90%;
				margin-left: auto;
				margin-right: auto;
				margin-top: 25px;
				grid-template-areas:
					"datebox"
					"banner1"
					"mainnav"
					"contactmain"
					"fbanner"
					"bottomadbox"
					"footer";
					
				}
.communitywrapper {
				display: grid;
				grid-template-columns: 1fr; 
				grid-template-rows: auto;
				width: 100%;
				margin-left: auto;
				grid-template-areas:
					"datebox"
					"topadbox"
					"mainnav"
					"banner1"
					"mainframe"
					"fbanner"
					"bottomadbox";
					
				}

.contactmain {
	grid-area: contactmain;
	display: grid;
	grid-template-columns: 20% 80%; 
				grid-template-rows: auto;
				width: 100%;
				margin-left: auto;
				margin-right: auto;
				grid-template-areas:
					"sidemenu1 contactframe"
					"sidemenu2 adframe";
					
				}
.contactframe { 
	grid-area: contactframe;
	width: 96%;
	margin-left: 20px;
	margin-right: auto;
	text-align: center;
	margin-top: 30px;
	
}
.adframe { 
	grid-area:adframe;
	width: 96%;
	margin-left: 20px;
	margin-right: auto;
	text-align: center;
	height:705px;
}
.onlineadsframe { 
	grid-area: contactframe;
	width: 96%;
	margin-left: 20px;
	margin-right: auto;
	text-align: center;
	margin-top: 15px;
	
}
.adsformframe { 
	grid-area:adframe;
	width: 96%;
	margin-left: 20px;
	margin-right: auto;
	text-align: center;
	height:705px;
	
}
.formframe {
	margin-top: 20px;
	height: 100%;
}
.sidemenu1 {
	grid-area: sidemenu1;
	min-width: 200px;
	max-width: 90%;
	display: grid;
	grid-template-rows: 1fr 1fr 1fr ; 
				width: 100%;
				margin-left: auto;
				margin-right: auto;
				grid-template-areas:
					"side1"
					"side2"
					"side3"
					;
				}
.sidemenu1 img {
		width: 100%;
		height: 100%;
		
}
.side1 {
	grid-area:side1;
	width:100%;
	border: 1px solid black;
	max-height:300px;
	background-color: white;
}
.side2 {
	grid-area:side2;
	width:100%;
	border: 1px solid black;
	max-height:300px;
	
}
.side3 {
	grid-area:side3;
	width:100%;
	border: 1px solid black;
	max-height:300px;
	
}
.sidemenu2 {
	grid-area: sidemenu2;
	min-width: 200px;
	max-width: 90%;
	display: grid;
	grid-template-rows: 1fr 1fr 1fr ; 
				width: 100%;
				margin-left: auto;
				margin-right: auto;
				grid-template-areas:
					"side21"
					"side22"
					"side23"
					;
				}
.sidemenu2 img {
		width: 100%;
		height: 100%;
		
}
.side21 {
	grid-area:side21;
	width:100%;
	border: 1px solid black;
	max-height:300px;
	background-color: white;
}
.side22 {
	grid-area:side22;
	width:100%;
	border: 1px solid black;
	max-height:300px;
	
}
.side23 {
	grid-area:side23;
	width:100%;
	border: 1px solid black;
	max-height:300px;
	
}
.side24 {
	grid-area:side4;
	width:100%;
	border: 1px solid black;
	max-height:270px;
	
	
}

.