:root {
	--primary-bg: rgba(255,255,255,0.9);
}

.homebody {
	font-family:sans-serif; 
	font-size:1.1em;
	background-image:url('/images/RRC_building_long.png');

	width:100%; 
	background-attachment:fixed;
	background-repeat:no-repeat; 
	background-position:top; 
	background-size:100%; 
	margin:0px;
	padding:0px;
}

.activity_content {
	font-family:sans-serif;
	font-size:1.4em;
	background-color:ddd;
}

.nav_area {
	position:fixed;
	top:0;
	right:0;
	background-color:black;
	display:flex; 
	justify-content:flex-end;
	gap:2px;
	flex-wrap:wrap;
}

.nav {
	width:100px;
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
	background-color:rgba(200,255,200,1);
}

.footerarea {
	position:fixed;
	bottom:0;
	right:0;
	background-color:rgba(0,0,0,1);
	color:white;
	font-size:smaller;
}



.header {
	width:100%;
	background-image:url("/images/stock.jpg");
	opacity:0.9;
	text-align:center; 
	margin-top:0px; 
	margin-bottom:0px;
	display:flex;
	flex-direction:column;
	min-height:450px;
	align-content:center;
}

.logo_and_heading {
	display:flex; 
	justify-content:center; 
	align-items:center; 
	margin:auto;
}

.content {
	width:100%;
	margin-left:auto;
	margin-right:auto;
}

.contentarea {
	width:80%;
	margin-left:auto;
	margin-right:auto;
	font-size:1.1em;
}
	
.features {
	width:90%;
	margin:20px auto 20px;
	background-color:var(--primary-bg); 
	padding:20px;
}

.join {
	width:90%;
	margin:auto;
	background-color:var(--primary-bg); 
	padding:20px;
	margin-top:20px;
	margin-bottom:30px;
}

.faq {
	padding:20px;
	width:90%; 
	margin:20px auto 30px; 
	background-color:var(--primary-bg);	
}

.schedule {
	width:95%; 
	padding:10px; 
	margin:auto;
	background-color:var(--primary-bg);
}


hr {
	height:4px;
	background:rgba(0,0,0,0);
	border:0;
	width:95%;
	margin-left:auto;
	margin-right:auto;
	margin-top:20px;
	margin-bottom:20px;
}

.highlights {
	width:70%;
	margin-top:20px;
	padding:20px;
	margin-bottom:0px;
	margin-left:auto;
	margin-right:auto;
	background-color:var(--primary-bg);
}

.news {
	width:100%;
	margin-bottom:0px;
	margin-left:auto;
	margin-right:auto;
	background-color:var(--primary-bg);
	padding-top:50px;
	padding-bottom:50px;
	font-size:1.2em;
}

.contact {
	width:70%;
	margin:20px auto 30px;
	background-color:var(--primary-bg);
	padding-left:20px;
	padding-top:50px;
	padding-bottom:50px;
	font-size:1.2em;
}

.activity_area {
	width:80%; 
	background-color:var(--primary-bg);
	margin:auto;
}

.activities {
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	padding:10px;
	width:80%;
	
	.activity {
		padding:10px;
		width:350px;
	}
	
	.caption {
		text-align:center;
	}
	
	.image {
		display:block;
		margin-left:auto;
		margin-right:auto;
		border:1px black solid;
		max-width:100%;
		height:auto;
	}
	
	.desc {
		font-size:0.9em;
		margin-left:20px;
		margin-right:20px;
	}
	
}

.statusnew {
	width:90%;
	margin-left:auto;
	margin-right:auto;
	margin-top:20px;
	margin-bottom:30px;
	background-color:var(--primary-bg);
	padding:20px;
	
}

.aboutus {
	margin-top:0px;
	margin-bottom:30px;
	width:100%;
	background-color:rgba(64,64,64,0.9);
	color:white;
}

.caption.activites {
	//text-align:center;
}

td {
	padding:5px;
}
	
@media (min-resolution:150dpi), (max-width:767px) {
	.highlights {
		margin-left:auto;
		margin-right:auto;
		width:90%; 
	}
	
	.contentarea {
		font-size:1.4em;
		width:100%;
		margin-left:auto;
		margin-right:auto;
	}
	
	.nav_area {
		font-size:1.6em;
		/*justify-content:center;
		right:auto;*/
	}
	
	.nav {
		padding-left:4px;
		padding-right:4px;
		width:auto;
	}
	
	.news {
		width:90%;
	}
	
}