
/* CSS Document */

html, body {
	margin:0;
	padding:0;
	height: 100%;
	background: #BCBEC0;
	position:relative;
}

img{
	border: none;
}

.template_p_tag{
	color:#FFFFFF;	
}


/**********************************************toggle the visibility of the login link in the top nav*/

.invisiblelogin a {
	display: none;
}

/*******************************************************************Accessibility**********************************************************/

/*Text size changes*/
.text100 {
	font-size: 100%;
}

.text105 {
	font-size: 110%;
}

.text110 {
	font-size: 130%;
}

.text115 {
	font-size: 160%;
}

.text120 {
	font-size: 180%;
}

.text125 {
	font-size: 200%;
}

/*zoom tables so they still fit*/
.text105 .textcontainer table,
.text105 .datacontainer table {
	font-size: 90%;
}

.text110 .textcontainer table,
.text110 .datacontainer table {
	font-size: 80%;
}

.text115 .textcontainer table,
.text115 .datacontainer table {
	font-size: 70%;
}

.text120 .textcontainer table,
.text120 .datacontainer table {
	font-size: 60%;
}

.text125 .textcontainer table,
.text125 .datacontainer table {
	font-size: 50%;
}

/******Contrast*************/

/*yellow and black*/
.yellow_black p,
.yellow_black div,
.yellow_black h1,
.yellow_black h2,
.yellow_black h3,
.yellow_black h4,
.yellow_black h5,
.yellow_black li,
.yellow_black span,
.yellow_black td,
.yellow_black th,
.yellow_black dt,
.yellow_black dd,
.yellow_black .top_container,
.yellow_black .top_nav_container,
.yellow_black .top_nav,
.yellow_black .textcontainer,
.yellow_black a,
.yellow_black .footer,
.yellow_black .sideimage,
.yellow_black .contact_container,
.yellow_black .landingtitle,
.yellow_black .landingtoptasks,
.yellow_black .toptasks_module,
.yellow_black .landingpages,
.yellow_black .datacontainer
{
	background-color: black !important;
	color: yellow !important;	
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.yellow_black a:hover,
.yellow_black a:focus {
	background-color: yellow !important;
	color: black !important;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.yellow_black .top_nav li {
	border-right: 2px solid yellow;
}

.yellow_black .top_nav_container {
	border-top: 2px solid yellow;
}

.yellow_black legend,
.yellow_black input.submit,
.yellow_black fieldset {
	background-color: black !important;
	color: yellow !important;	
	border: 2px solid yellow !important;
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.yellow_black input.submit:hover {
	background-color: yellow !important;
	color: black !important;	
	border: 2px solid black !important;
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.yellow_black input,
.yellow_black textarea {
	background-color: black !important;
	color: yellow !important;	
	border: 1px solid yellow !important;
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

/*red and pink*/

.red_pink p,
.red_pink div,
.red_pink h1,
.red_pink h2,
.red_pink h3,
.red_pink h4,
.red_pink h5,
.red_pink li,
.red_pink span,
.red_pink td,
.red_pink th,
.red_pink dt,
.red_pink dd,
.red_pink .top_container,
.red_pink .top_nav_container,
.red_pink .top_nav,
.red_pink .textcontainer,
.red_pink a,
.red_pink .footer,
.red_pink .sideimage,
.red_pink .contact_container,
.red_pink .landingtitle,
.red_pink .landingtoptasks,
.red_pink .toptasks_module,
.red_pink .landingpages,
.red_pink .datacontainer
{
	background-color: pink !important;
	color: red !important;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.red_pink a:hover,
.red_pink a:focus {
	background-color: red !important;
	color: pink !important;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.red_pink .top_nav li {
	border-right: 2px solid red;
}

.red_pink .top_nav_container {
	border-top: 2px solid red;
}

.red_pink legend,
.red_pink input.submit,
.red_pink fieldset {
	background-color: pink !important;
	color: red !important;	
	border: 2px solid red !important;
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.red_pink input.submit:hover {
	background-color: red !important;
	color: pink !important;	
	border: 2px solid pink !important;
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.red_pink input,
.red_pink textarea {
	background-color: pink !important;
	color: red !important;	
	border: 1px solid red !important;
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

/*black and white*/

.black_white p,
.black_white div,
.black_white h1,
.black_white h2,
.black_white h3,
.black_white h4,
.black_white h5,
.black_white li,
.black_white span,
.black_white td,
.black_white th,
.black_white dt,
.black_white dd,
.black_white .top_container,
.black_white .top_nav_container,
.black_white .top_nav,
.black_white .textcontainer,
.black_white a,
.black_white .footer,
.black_white .sideimage,
.black_white .contact_container,
.black_white .landingtitle,
.black_white .landingtoptasks,
.black_white .toptasks_module,
.black_white .landingpages,
.black_white .datacontainer
{
	background-color: white !important;
	color: black !important;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.black_white a:hover,
.black_white a:focus {
	background-color: black !important;
	color: white !important;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.black_white .top_nav li {
	border-right: 2px solid black;
}

.black_white #logo {
	display: none;
}

.black_white #logo_black {
	display:block;
}

.black_white .top_nav_container {
	border-top: 2px solid black;
}

.black_white legend,
.black_white input.submit,
.black_white fieldset {
	background-color: white !important;
	color: black !important;	
	border: 2px solid black !important;
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.black_white input.submit:hover {
	background-color: black !important;
	color: white !important;	
	border: 2px solid white !important;
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.black_white input,
.black_white textarea {
	background-color: white !important;
	color: black !important;	
	border: 1px solid black !important;
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}


/******************************************************************Header**********************************************************/

.top_container {
	background-color:#9E2754;
	padding-bottom: 15px;
	width: 100%;
	overflow:hidden;
}

.top_bar {
	background: #7F1E44;
	width: 100%;
	overflow:hidden;
	margin-bottom: 10px;
	padding: 2px;
}

.account_access {
	float: right;
	display: none;
}

.account_access p {
	color: #FFF;
	margin: 0;
	font-size: 0.9em;
	text-align:center;
}

.account_access a {
		color: #FFF;
		font-size: 1em;
		padding-right: 8px;
		padding-left: 8px;
		transition:all .7s;
		-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
		margin-left: 3px;
		text-decoration:none;
}

	.account_access a:hover,
	.account_access a:focus {
		background: #394264;
		border-radius: 3px;	
		transition: background 0.7s;
		-webkit-transition: background 0.7s; /* Safari */
	}
	
.account_access_w {
	float: right;
	display: none;
}

.account_access_w p {
	color: #FFF;
	margin: 0;
	font-size: 0.9em;
	text-align:center;
}

.account_access_w a {
		color: #FFF;
		font-size: 1em;
		padding-right: 8px;
		padding-left: 8px;
		transition:all .7s;
		-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
		margin-left: 3px;
		text-decoration:none;
}

	.account_access_w a:hover,
	.account_access_w a:focus {
		background: #394264;
		border-radius: 3px;	
		transition: background 0.7s;
		-webkit-transition: background 0.7s; /* Safari */
	}

/*Skip to content buttons*/
.skip_buttons {
	margin-left: 10%;
	float: left;
	
}

.skip_buttons p {
	color: #FFF;
	margin: 0;
	font-size: 0.9em;
}

.skip_buttons a {
		color: #FFF;
		font-size: 1em;
		padding-right: 8px;
		padding-left: 8px;
		transition:all .7s;
		-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
		margin-left: 3px;
		text-decoration:none;
}

	.skip_buttons a:hover,
	.skip_buttons a:focus {
		background: #394264;
		border-radius: 3px;	
		transition: background 0.7s;
		-webkit-transition: background 0.7s; /* Safari */
	}

/*LOGO*/
	#logo {
		padding-left: 1%;
		text-align:left;
		float:none;
	}

	#logo_black {
		padding-left: 1%;
		text-align:left;
		float:none;
		display:none;
	}
	
	.headerleft {
		overflow: hidden;
		text-align:center;
	}

/*RIGHT SIDE OF HEADER*/	
	
	.headerright {
		text-align:center;
		padding: 0;
		margin: 0;
		overflow:hidden;
	}


/*header links*/	
	.headerlinks ul{
		padding-left: 0;
		margin: 0;
		padding-bottom: 5px;
		padding-top: 5px;
	}
	
	.headerlinks ul li {
		display:inline-block;
	}
	
	.headerlinks ul li a {
		color: #FFFFFF;
		font-size: 1em;
		padding-right: 2px;
		padding-left: 2px;
		padding-bottom: 2px;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
		margin-left: 3px;
		text-decoration:none;
	}
	
	.headerlinks ul li a:hover,
	.headerlinks ul li a:focus {
		background: #394264;
		border-radius: 3px;	
		transition: background 0.7s;
		-webkit-transition: background 0.7s; /* Safari */
	}

/*A to Z*/
	.a_2_z {
		display:none;
	}
	
	.mobile_a2z {
		display:block;
		text-align:center;
		padding-top: 5px;
		margin: 0;
	}
	
	.mobile_a2z p {
		padding-top: 32px;
		padding-bottom: 5px;
		margin: 0;
	}
	
	.mobile_a2z a {
		color: #FFFFFF;
		font-size: 1em;
		text-decoration:none;
		padding-right: 2px;
		padding-left: 2px;
		padding-bottom: 2px;	
		width: 100%;
		overflow:hidden;
		margin-top: 10px;	
		transition:all .7s;
		-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
	}
	
	.mobile_a2z a:hover, 
	.mobile_a2z a:focus {
	background: #394264;
	border-radius: 3px;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
	}

/*search*/
	.gcse-searchdiv {
		width: 94%;
		height: 32px;
		padding-right: 3%;
		padding-left: 3%;
		padding-bottom: 2px;
		margin-right: 0px;
		float:right;
		overflow:hidden;
	}
	
	.gcse-searchdiv a {
		color: #FFFFFF;
	}
	
	.gcse-searchdiv a:hover,
	.gcse-searchdiv a:focus {
		color: #394264;
	}
		
	/*top nav*/
	.top_nav_container {
		width: 100%;
		overflow:hidden;
		background-color: #1E243C;
	}
	
	.top_nav {
		background-color: #394264;
		margin-left: 0;
		margin-right: 0;
		margin-top: 0;
		margin-bottom: 0;
		padding:0;
		overflow:hidden;
		text-align:center;
		width: 100%;
	}
	
	.top_nav ul {
		margin: 0;
		padding:0;
	}
	
	.top_nav li {
		display: inline-block;
		text-align:center;
		border-right: 2px solid #1E243C;
		padding: 0;
		margin: 0;
	}
	
	.top_nav_first {
		border-left: 2px solid #1E243C;
	}
	
	.top_nav a {
		color: #FFFFFF;
		width: 5em;
		font-size: 0.9em;
		padding-top: 3px;
		padding-bottom: 3px;
		display: inline-block;
		text-decoration: none;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
	}
	
	.top_nav ul li a:hover, 
	.top_nav ul li a:focus {
	background: #9E2754;	
	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
	}
	
	.current {
		background: #9E2754;	
	}

/*************************************************************Content*******************************************************/

	.content {
		margin-left: 3%;
		margin-right: 3%;
		width: 94%;
		overflow:hidden;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	
	.textcontainer {
		background: #FFFFFF;
		border-radius: 4px;
		padding-bottom: 10px;
		margin-bottom: 20px;
		padding-left: 10px;
		padding-right: 10px;
	}
	
	.indexcontainer {
		margin: 0;
	}
	
	.datacontainer {
		width: 98%;
		overflow: visible;
		background: #ffffff;
		border-radius: 4px;	
		padding: 1%;
		margin-bottom: 20px;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
	}
	
	#map:hover {
		cursor: pointer;
	}
	
	#map:hover .datacontainer {
		background: #9E2754;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
	}
	
/*************************************************************Advertisting*******************************************************/

#adverts {
    /*background: none repeat scroll 0 0 #fff;
    float: left;*/
    width: 95%;
}

.adblock {
    margin: 10px 0 -10px 5px;
	overflow: hidden;
	/*display: none;*/
}
.adblock_test {
    margin: 10px 0 -10px 5px;
	/*padding: 1%;*/
	overflow: hidden;
}
.centred {
    text-align: center;
}

.centred img {
	max-width: 100%;
    height: auto;
	transition: all 0.7s;
	-webkit-transition: all 0.7s; /* Safari */
}

#adverts p {
    color: #9E2754;
    font-size: 0.7em;
    font-weight: normal;
    margin-top: -18px;
    text-align: center;
	margin-bottom: 0;
}
#adverts_test p {
    color: #9E2754;
    font-size: 0.7em;
    font-weight: normal;
    margin-top: -18px;
    text-align: center;
	margin-bottom: 0;
}
#advertising {
    max-width: 728px;
	/*max-width: 100%;*/
    height: auto;
	transition: all 0.8s;
	-webkit-transition: all 0.8s; /* Safari */
    margin: auto !important;
    text-align: center !important;
	/*padding-left: 5px;*/
}

/***********Landing Pages***************/

.landingtitle {
	background-color: #FFFFFF;
	border-radius: 4px;
	padding: 15px;
	padding-left: 4%;	
	margin-bottom: 20px;
	text-align:center;
}

.landingtitle h1 {
	color: #9E2754;
	margin: 0;
}

.landingtoptasks {
		border-radius: 4px;
		margin-bottom: 20px;	
		overflow:hidden;
}

.landingpages {
		background: #FFFFFF;
		border-radius: 4px;
		margin-bottom: 20px;
		overflow:hidden;
}

/***Top Tasks***/

.toptasks_module h2 {
	background: #394264;
	color: #FFFFFF;
	font-size: 1.3em;
	font-weight: 300;
	text-align:center;
	padding: 10px;
	margin: 10px;
	margin-bottom: 0;
	}
	
.toptasks_module {
	background: #FFFFFF;
	border-radius: 4px;	
	padding-top: 0;
	width: 100%;
	overflow: hidden;
	margin-bottom: 20px;
}

.toptasks_module ul {
	padding: 0;
	margin-top: 10px;
	margin-bottom: 10px;
	list-style: none;
}

.toptasks_module ul li a {
	text-decoration: none;
	color:#394264;
	background-color: #E5E5E5;
	font-size: 1em;
	padding-left: 52px;
	padding-top: 14px;
	padding-bottom: 14px;
	border-bottom: 1px solid #BCBEC0;
	margin-left: 10px;
	margin-right: 10px;
	display: block;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.toptasks_module ul li a:hover,
.toptasks_module ul li a:focus {
	background-color: #9E2754;
	cursor:pointer;
	color: #FFFFFF;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}



/***Pages***/

.landingpages h2 {
	background: #394264;
	color: #FFFFFF;
	font-size: 1.3em;
	font-weight: 300;
	text-align:center;
	padding: 10px;
	margin: 10px;
	margin-bottom: 0;
	}
	
.pages_module h3 {
	color: #9E2754;
	font-size: 1.5em;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
}

.page_blurb {
	font-size: 1em;
	color: #394264;
	margin-top: 5px;
	transition: color 0.7s;
	-webkit-transition: color 0.7s; /* Safari */

}

.pages_module li a {
	margin-left: 10px;
	margin-right: 10px;
}

	
/***********************************************************Footer***********************************************************/

	.footerholder {
			background: #1E243C;
			width:100%;
			position: inherit;
			left: 0;
			bottom: 0;
			clear: both;

	}
	
	.footer {
			margin-left: 3%;
			margin-right: 3%;
			width: 94%;
			padding-top: 5px;
			padding-bottom: 5px;
	}
	
/*Left Side*/
	.footerleft {
		text-align:center;
		color: #FFFFFF;
	}
	
	.footerleft p {
		margin-bottom: 2px;
		margin-top: 0;
	}
	
	.social ul {
		margin: 0;
		padding:0;
	}

	.social li {
		display: inline-block;
		text-decoration:none;
	}
	
	.social li a {
		text-decoration: none;
		display: inline-block;
		padding: 4px;
		padding-bottom: 0;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
	}
	
	.social ul li a:hover, 
	.social ul li a:focus {
		background: #9E2754;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
	}

	.bottomlinks ul {
		margin: 0;
		padding:0;
		padding-top: 12px;
		padding-bottom: 0;
	}

	.bottomlinks li {
		display: inline-block;
		text-decoration:none;
	}
	
	.bottomlinks li a {
		text-decoration: none;
		display: inline-block;
		padding-right: 7px;
		padding-left: 7px;
		color: #FFFFFF;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
	}
	
	.bottomlinks ul li a:hover, 
	.bottomlinks ul li a:focus {
		background: #9E2754;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
	}

/*Right Side*/
	.footerright {
		text-align:center;
		color: #FFFFFF;
	}
	
	.footerright p {
		margin-bottom: 2px;
	}
	
	.usefullinks ul {
		margin: 0;
		padding:0;
	}

	.usefullinks li {
		display: inline-block;
		text-decoration:none;
	}
	
	.usefullinks li a {
		text-decoration: none;
		display: inline-block;
		padding: 4px;
		padding-bottom: 0;	
		transition:all .7s;
		-webkit-transition: all .7s; /* Safari */
		border-radius: 3px;
	}

	.usefullinks ul li a:hover, 
	.usefullinks ul li a:focus {
		background: #9E2754;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
	}
	

/*************************************************************Media Queries******************************************************/

@media screen and (min-width: 768px) {
	/*Logo*/
	#logo {
		padding-top: 5px;
	}

	#logo_black {
		padding-top: 5px;
		display: none;
	}
	
	.headerleft {
		float:left;
		margin-left:5%;
	}
	
	.top_bar {
		margin-bottom: 20px;
		padding: 5px 0px;
	}
	
	.top_container {

	padding-bottom: 20px;

	}
	.account_access {
		margin-right: 10%;
	}



/* right part of the header */

	.headerright {
		padding-right: 5%;
		text-align:right;
	}

/*Links on top of search box*/
	.headerlinks ul li a {
		padding-right: 8px;
		padding-left: 8px;
	}
	


/*Search box styles */
.gcse-searchdiv {
		width: 416px;
		padding: 0;
		margin-top: 3px;
		margin-bottom: 3px;
		margin-right: 0px;
		float:right;
	}


/* A to Z list */
.a_2_z {
 clear:right;
 display:block;
}

.a_2_z li {
	display:inline-block;
	text-decoration: none;
}

.a_2_z ul {
	margin:0;
	padding-bottom: 2px;
}

.a_2_z a {
	color: #FFFFFF;
	font-size:0.9em;
	text-decoration: none;
	width: 16px;
	line-height: 16px;
	display:inline-block;
	text-align:center;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
	border-radius: 3px;
}


.a_2_z a:hover,
.a_2_z a:focus {
	background: #394264;
	border-radius: 3px;	transition:all .7s;
	-webkit-transition: all .7s; /* Safari */
	}

.nohover a {
	color: #BCBEC0;
}

.nohover a:hover,
.nohover a:focus {
	background: none;
	cursor: not-allowed;
}
	
.mobile_a2z {
	display:none;
}

/*Top Navigation Bar*/
	
	.top_nav {
		margin-left: 5%;
		margin-right: 5%;
		overflow:hidden;
		width: 90%;
	}

	.top_nav ul {
		float:left;
	}

	.top_nav_first {
		border-left: none;
	}
	

	.top_nav ul li a {
		font-size: 1em;
		width: 7em;
	}
	
/*************************************************************Content*******************************************************/

.content {
	margin-left: 5%;
	margin-right: 5%;
	width: 90%;
	overflow:auto;
	padding-top: 20px;
	padding-bottom: 0;
}

.textcontainer {
    background: #FFFFFF;
	margin-bottom: 20px;
	overflow:auto;
	float:left;
	margin-right: 340px;
	padding: 20px;
	padding-top: 0px;
    width:-moz-calc(100% - 380px);
    width:-webkit-calc(100% - 380px);
    width:calc(100% - 380px);	
	transition:all .7s;
	-webkit-transition:all .7s; /* Safari */
}

.indexcontainer {
	margin-bottom: 20px;
	overflow:auto;
	float:left;
	margin-right: 340px;
    width:-moz-calc(100% - 340px);
    width:-webkit-calc(100% - 340px);
    width:calc(100% - 340px);	
	transition:all .7s;
	-webkit-transition:all .7s; /* Safari */
}

.rightsidebar,
.index_rightsidebar {
    width: 320px;
	margin-left: -340px;
	float: right;
}


/***********Landing Pages***************/

.landingtoptasks {
	width: 34%;
	float:right;
}

.landingpages {
	width: 64%;
	float:left;
}

.landingtitle {
	text-align: left;
}

/**********************************************Footer**********************************************/
	.footerholder {
			/*background: none;*/
			padding-bottom: 36px;
	}
	
	.footer {
			margin-left: 5%;
			margin-right: 5%;
			width: 90%;
			background: #1E243C;
			border-radius: 4px;
			overflow:hidden;
		}
/*Left Side*/		
	.footerleft {
		float:left;
		text-align:left;
		padding-left: 6px;
		padding-top: 5px;
	}
	
	.footerleft p {
		padding-left: 4px;
		padding-bottom: 4px;
	}
	
	.bottomlinks ul {
		padding-top: 4px;
		padding-bottom: 10px;
	}
	
	.bottomlinks a {
		padding-left: 10px;
		padding-right: 10px;
	}


/*Right Side*/	
	.footerright {
		float:right;
		text-align:right;
		padding-right: 6px;
		padding-top: 5px;
	}
	
	.footerright p {
		margin-top:0;
		padding-right: 4px;
		padding-bottom: 4px;
	}
	
	.copyright {
		padding-bottom: 6px;
		padding-top: 4px;
	}
	
}
/********************************************FINAL MEDIA QUERY************************************/
@media screen and (min-width: 860px) {
	.headerleft {
		margin-left: 10%;
	}
	.headerright {
		padding-right: 10%;
	}
	.top_nav {
		margin-left: 10%;
		margin-right: 10%;
		width: 80%;
	}
	.content {
		margin-left: 10%;
		margin-right: 10%;
		padding-right:0;
		width: 80%;
	}
	.footer {
		margin-left: 10%;
		margin-right: 10%;
		width: 80%;
	}
}


