﻿/* Global */

html	{	}

body	{ 
	font-family:Arial, Helvetica, sans-serif; 
	background:url('../images/home/home-background.jpg') no-repeat fixed ;
	background-position:center;
	background-color:silver;
}



/* Containers - id styles */

#wrapper				{ 
	width:900px; 
	margin:0 auto; 
	background-color:#fff;
}

#top					{  }

#banner					{ 
	background-color: #006666 ;
	width: auto;
	height: 220px;
	padding:20px 20px 10px 20px; 
	border-bottom:1px solid #fff;
}

#banner img			{
	float:right;
}

#banner h1				{
	font-size: 60px;
	font-family: Papyrus;
	color: white;
	font-weight: bold;
	line-height: 150%;
	margin-bottom: 0;
}

#banner h2				{
	margin-bottom: 5px;
	margin: 5px 0 0 0;
	font-size: 30px;
	font-family: Papyrus;
	color: white;
	font-weight: bold;
	line-height: 150%;
}

#topnav

#topnav a {
			color: white;
			text-decoration:none;
			font-family:Arial, Helvetica, sans-serif;
			font-size:16px;
		}
	
#topnav li a:hover {	
			color:black;
		}
		
#topnav ul {
			padding: 0;
			margin: 0;
			background: #666;
			float: left;
			width:100%;
			min-width:150px;
		}
	
		#topnav ul li {
			float: left;
			display: inline;
			position: relative;
			list-style: none;
		}
		
		#topnav ul li a	{	
			color: white;
			text-decoration:none;
			padding:14px 16px;
		}
		
		#topnav li a {
			float:left;
		}
	
		#topnav ul ul {   /* this is .dropdown-content in skeals.css */
			position: absolute;
			left: 0;
			top: 100%;
			background: #666;
			display: none;
			box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
			z-index: 1;
			color:black;
			min-width:180px;
		}
	
		#topnav ul ul ul {  /* this is submenu */
			left: 100%;
			top: 0;
			background: #666;
			color:black;
		}
	
		#topnav li:hover > ul {
			display: block;
		}


#content-wrapper		{  }

#leftnav				{  }

#leftside				{  }

#content				{ 
	float:left; 
	width:600px; 
	padding:20px 20px 20px 30px; 
}

#content h1				{ 
	margin:0 0 20px 0; 
	padding:20px 0; 
	border-bottom:2px gray solid; 
	font-family:Arial, Helvetica, sans-serif; 
}

#content h3				{ 
	margin:0 0 20px 0; 
	padding:20px 0; 
	border-bottom:1px gray solid; 
	font-family:Arial, Helvetica, sans-serif; 
}

#content h5				{
	margin:0 0 20px 0; 
	padding:10px 0 20px 0; 
	font-family:Arial, Helvetica, sans-serif; 
	font-style:italic;
}

#content p				{ 
	clear:both; 
	margin:0 0 16px 0; 
	padding:8px 5; 
	font-size:16px;  
	line-height:175%; 
}

#content ul				{ 
	margin: 20px 0px 30px 20px; 
	padding: 5px; 
	font-size: 16px; 
	list-style-type: disc;
}

#content ul li			{ 
	padding:8px 0; 
	font-size:16px; 
	line-height:150%; 
}

#content img			{
	margin: 20px; 
	border:1px solid; 
	border-color:gray; 
	padding: 5px;
	margin:auto;
}


/* Article Pages Template - no right sidebar */

#content-articles		{
	float:left;
	width:830px;
	padding:20px 20px 20px 30px;
}

#content-articles h1	{ 
	margin:0 0 20px 0; 
	padding:20px 0; 
	border-bottom:2px gray solid; 
	font-family:Arial, Helvetica, sans-serif; 
}

#content-articles h3	{ 
	margin:0 0 20px 0; 
	padding:20px 0; 
	border-bottom:1px gray solid; 
	font-family:Arial, Helvetica, sans-serif; 
}

#content-articles h5			{
	margin:0 0 20px 0; 
	padding:10px 0 20px 0; 
	font-family:Arial, Helvetica, sans-serif; 
	font-style:italic;
}

#content-articles p				{ 
	clear:both; 
	margin:0 0 16px 0; 
	padding:8px 5; 
	font-size:16px;  
	line-height:175%; 
}

#content-articles img	{
	margin: 10px; 
	border:1px solid; 
	border-color:gray; 
	padding: 5px;
	margin:auto;
}


/* To be finalised - all lists other than top nav */

#content-articles ul {
	list-style-type: disc;
	margin: 0 40px 0 40px;
	padding: 0;
	display:block;
	font-size:16px;  
}

#content-articles li {
	float:none;
	font-size:16px; 
	list-style-type: disc; 
}

#content-articles ul li {  }

#content-articles li a	{ }


/*END of To be finalised*/



/* END of Article Pages Template - no right sidebar */


#rightside				{
	padding: 10px 30px 10px 10px;
	margin-left: 660px;
	margin-top:50px;
	text-align: center;
}

#rightside img			{ 
	float:none; 
	margin: 10px; 
	border:1px solid; 
	border-color:gray; 
	padding: 5px; 
}

#rightside h3			{ 
	margin:20px 0 0 0; 
	line-height:150%; 
	padding:20px 0; 
	font-size:20px; 
	font-family:Arial, Helvetica, sans-serif; 
}

#rightside a			{
	color:black;
	text-decoration:none;
}


#footer					{ 
	clear:both;
	margin:auto;
	background-color:#006666; 
	padding:10px 0; 
}

#footer p				{ 
	color:white; 
	text-align:center; 
}

/*Go to Top button - plus script in head of dwt*/

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #006666;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 10px;
}

#myBtn:hover {
  background-color: #666;
}


/*Events Calendar*/

.calendar-container {
	max-width:900px;
	margin:auto;
	font-family:Arial, Helvetica, sans-serif;
}

.calendar-month {
	text-align:center;
	background:#006666;
	font-size:2em;
	letter-spacing:1px;
	color:white;
	padding:20px;
	border:1px solid gray;
}

.tdevent {
	background-color:green;
	color:white;
	padding:20px;
}


#calendar-table {
	width:100%;
	table-layout:fixed;
	text-align:center;
	font-size:17px;
	border:1px solid gray;
	border-collapse:collapse;
}

#calendar-th {
	width:100%;
	table-layout:fixed;
	text-align:center;
	font-size:17px;
	border:1px solid gray;
	border-collapse:collapse;
	background:#006666;
	color:white;
	padding:10px;
}

#calendar-td {
	width:100%;
	table-layout:fixed;
	text-align:center;
	font-size:17px;
	border:1px solid gray;
	border-collapse:collapse;
	background:#f4f4f4;
	padding:15px;
}

#calendar-tr {
	padding:10px;
}

#calendar-td:hover {
	background:#CCCCCC;
	color:white;
}

/*End of Calendar of Events*/


/*Gallery Styling*/

.gallery {
	margin:10px 30px;
}

.gallery-button {
	border: none;
	color: white;
	padding: 10px 15px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	cursor: pointer;
	background-color:#006666;
}

.gallery-button:hover {
  background-color: #666;
}

/*End of Gallery*/






