
/*
Lovingly hand-crafted by Citrus Tree Media.
http://www.citrustreemedia.com/
Please respect our copyright as we do yours...
*/

/* ---------------------
title: CMS drupal stylesheet
author: Simon Tweedale
created: 15/06/10
updated: 23/07/10 WT
		 10/09/12 ST
		 28/11/14 ST
version: 1.3
--------------------- */

/* ----------------------------------------------------------------------------- base styles */

/* reset everything, including pseudo elements. Apply the border-box model (http://css-tricks.com/box-sizing/) */
*,
*:before,
*:after {
	margin: 0;
	border: none;
	padding: 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

/* this helps windows phones and IE with media queries */
@-ms-viewport{
	width: device-width;
}

/* make me font nice webkit */
html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* set font at body level, comment out serif or sans serif accordingly. Line height at 1.5 to give a nice spacing. */
body {
	font-family: sans-serif;
	/*font-family: serif;*/
	line-height: 1.5;
	background: white;
}

/* set these html5 tags to display:block to make old IE versions happy */
section, header, footer, aside, article, nav	{
	display: block;
}

/* add a simple color transition to all links for a nicer hover. remove outline for older browsers */
a {
	outline: none;
	color: blue;
	-webkit-transition: Color 0.3s ease;
	-moz-transition: Color 0.3s ease;
	-ms-transition: Color 0.3s ease;
	-o-transition: Color 0.3s ease;
	transition: Color 0.3s ease;
}

/* add a simple hover state */
a:hover {
	text-decoration: none;
	color: #000;
}

/*this for old firefox versions to remove the ugly dotted line from links (http://bit.ly/1tHimBi) */
:focus {
	-moz-outline-style: none;
}

/* in the flow of an article page, give h2s some extra padding to the top to seperate them from the previous paragraph */
article h2	{
	padding-top: 10px;
}

/* give padding to the bottom of all paragraphs and lists */
p, article ul, article ol	{
	padding-bottom: 1em;
}

/* left-indent lists */
article ul, article ol {
	padding-left: 30px;
}

/* make all images block level */
img {
	display: block;
}

/* ----------------------------------------------------------------------------- layout */

.wrapper, footer, .content, header, .content-wrapper {
	margin: 0 auto;
	position: relative;
	clear: both;
}

/* .wrapper controls our maximum width. 1200px is default, override if required */
.wrapper {
	max-width: 1200px;
}

/* <article> is our main column on two-column page layouts */
article	{
	float: left;
	width: 70%;
}

/* <aside> is our side column on two-column page layouts */
aside	{
	float: right;
	width: 25%;
}

/* ----------------------------------------------------------------------------- logo */

/* logo top left in majority of designs */
.logo {
	float: left;
}

/* hide our printer friendly logo for screen ("printer friendly" is smaller and greyscale) */
img.logo-print {
	display: none;
}

/* ----------------------------------------------------------------------------- header contact details */

/* header contact details top right in majority of designs */
header div.contact {
	float: right;
}

/* remove the bullets */
header div.contact ul {
	list-style: none;
}

/* make header contact details appear next to each other */
header div.contact li {
	float: left;
	margin-left: 10px;
}

/* its unlikely we want underlines on links that appear in the header */
header a {
	text-decoration: none;
}

/* ----------------------------------------------------------------------------- custom text selection */

/* Mozilla based browsers */
::-moz-selection {
	background-color: #FFA;
	color: #000;
}
/* Works in Safari */
::selection {
	background-color: #FFA;
	color: #000;
}

/* ----------------------------------------------------------------------------- clearfix */

/**
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
 .clearfix:before,
 .clearfix:after {
 	content: " "; /* 1 */
 	display: table; /* 2 */
 }

 .clearfix:after {
 	clear: both;
 }

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
 .clearfix {
 	*zoom: 1;
 }

 /* ----------------------------------------------------------------------------- admin tabs style */

 ul.primary, ul.secondary {
 	list-style: none;
 	height: auto;
 	line-height: normal;
 	overflow: auto;
 	text-shadow: none;
 	border: none;
 	background: #666;
 	padding: 5px !important;
 	margin-bottom: 15px;
 	-moz-border-radius: 3px;
 	border-radius: 3px;
 }

 ul.primary li, ul.secondary li {
 	display: inline;
 	background-image: none;
 	padding: 0;
 }

 ul.primary li a, ul.secondary li a {
 	margin-right: 5px;
 	text-decoration: none;
 	padding: 0 10px;
 	display: block;
 	float: left;
 	height: 22px;
 	line-height: 22px;
 	background: #999;
 	font-weight: bold;
 	font-size: 12px;
 	color: #eee;
 	text-transform: uppercase;
 	border: 1px solid #666;
 }

 ul.primary li a:hover, ul.secondary li a:hover {
 	background: #333;
 	color: #fff;
 }

 ul.primary li.active a, ul.secondary li.active a {
 	font-weight: bold;
 	color: #666;
 	background: #eee;
 }

 ul.primary li.active a:hover, ul.secondary li.active a:hover {
 	color: #000;
 	background: #fff;
 }

 ul.secondary {
 	background: #999;
 	font-size: 90%;
 }

 /* ----------------------------------------------------------------------------- messages style */

 .messages	{
 	padding: 10px !important;
 	margin-bottom: 10px;
 }

 .messages p	{
 	padding: 0 !important;
 }

 div.error	{
 	background: #eb9d9d;
 	border:2px solid #DD7777;
 	color: #940d0d;
 }

 div.error a	{
 	color: #550707 !important;
 	border-bottom: 1px dotted #550707 !important;
 }

 div.status, div.notice	{
 	background: #91d876;
 	border:2px solid #469528;
 	color: #008000;
 }

 .messages ul	{
 	margin: 0 !important;
 	padding: 0 0 0 20px !important;
 }

 .messages ul li	{
 	padding: 0 0 10px 0 !important;
 	background: none !important;
 	list-style: square !important;
 }

 /* ----------------------------------------------------------------------------- .view  and .browse */

 ul.view, ul.browse	{
 	list-style: none;
 	padding: 0 !important;
 	margin: 0;
 }

 ul.view li a, ul.browse li a	{
 	text-decoration: none;
 	display: block;
 }

 /* ----------------------------------------------------------------------------- ctas */

 div.ctas ul {
 	list-style: none;
 }

 div.ctas ul li {
 	float: left;
 }

 div.ctas ul li a {
 	display: block;
 	text-decoration: none;
 	position: relative;
 }

 /* ----------------- in sidebar */

 aside div.ctas {
 	width: auto;
 }

 aside div.ctas ul.ctas li {
 	width: auto;
 	float: none;
 	margin: 0 0 30px;
 }

 /* ----------------------------------------------------------------------------- feature panels */

 ul.panels {
	list-style: none;
}

ul.panels img {
	width: 100%;
	height: auto;
	display: block;
}

.owl-prev, .owl-next	{
	position: absolute;
	top: 50%;
	text-indent: -9999em;
	width: 45px;
	height: 45px;
	margin-top: -22px;
	background: #333;
	-webkit-transition: background 0.3s ease;
	-moz-transition: background 0.3s ease;
	-ms-transition: background 0.3s ease;
	-o-transition: background 0.3s ease;
	transition: background 0.3s ease;
}

.owl-prev::after, .owl-next::after {
	position: absolute;
	text-indent: 0;
	display: block;
	height: 0;
	width: 0;
	display: block;
	border-bottom: 10px solid transparent;
	border-right: 15px solid #fff;
	border-top: 10px solid transparent;
	content: "";
	top: 50%;
	left: 50%;
	margin: -10px 0 0 -10px ;
}

.owl-next {
	right: 0;
}

.owl-next::after {
	border-bottom: 10px solid transparent;
	border-left: 15px solid #fff;
	border-right: none;
	border-top: 10px solid transparent;
	left: 60%
}

.owl-prev:hover, .owl-next:hover {
	background: #000;
}

 /* ----------------------------------------------------------------------------- to-top */

 #totop	{
 	bottom: 0;
 	right: 15px;
 }

 #totop a {
 	background: #666;
 	border: none;
 	border-radius: 0;
 	color: #fff;
 	font-size: 12px;
 	border-radius: 5px 5px 0 0;
 	padding: 5px 12px;
 	-webkit-transition: background-color 0.3s ease;
 	-moz-transition: background-color 0.3s ease;
 	-ms-transition: background-color 0.3s ease;
 	-o-transition: background-color 0.3s ease;
 	transition: background-color 0.3s ease;
 }

 #totop a:hover {
 	background: #333;
 	border: none;
 	color: #fff;
 }

 /* ----------------------------------------------------------------------------- pager */

 .item-list	{
 	margin-top: 1em;
 	clear: both;
 	overflow: hidden;
 	text-align: center;
 }

 ul.pager, .item-list .pager li	{
 	background: none;
 	display:inline;
 	list-style: none;
 	padding: 5px;
 }

 .item-list .pager li a	{
 	color: black;
 	padding: 10px 15px;
 	background-color: #ccc;
 	text-decoration: none;
 }

 .pager-current	{
 	font-weight:bold;
 	color: black;
 }

 .item-list .pager li a:hover	{
 	text-decoration: none;
 	background: #fff;
 }

 /* -----------------------------------------------------------------------------   forms */

 label	{
 	display:block;
 	padding-top: 8px;
 }

 input, textarea, select{
 	margin: 2px 0;
 	padding: 6px;
 	color: #333;
 	border: 1px solid #ccc;
 	font-family: sans-serif;
 	font-size: 16px;
 }

 input:focus,textarea:focus	{
 	border: 1px solid #999;
 }

 input.form-submit	{
 	width: auto;
 	color: #999;
 	border: none;
 	cursor: pointer;
 	background: #333;
 }

 input.form-radio	{
 	width: 20px;
 	border: 0;
 }

 .form-required	{
 	color: red;
 }

 #user-login-form 	{
 	text-align: left;
 }

 /* -----------------------------------------------------------------------------	captcha */

.captcha {
	background: #eee;
	padding: 10px;
	margin-bottom: 15px;
}

input[type="radio"] {
	box-shadow: none;
}

.captcha legend {
	padding: 10px 0 0 0;
	font-weight: bold;
}

.captcha div.form-radios div.form-item {
	float: left;
}

 /* -----------------------------------------------------------------------------   tables style */

 caption	{
 	text-align: left;
 	margin-bottom: 10px;
 }

 table	{
 	margin-bottom: 10px;
 	border-collapse: collapse;
 }

 td, th	{
 	vertical-align: top;
 	padding: 4px;
 	border: 1px solid #000;
 }

 tr.odd	{
 	background: #fff;
 }

 thead tr	{
 	background: #999;
 }

 tr.even	{
 	background: #eee;
 }

 /* -----------------------------------------------------------------------------   NAV */

 /* --------------------------------------------   primary level */

ul#nav	{
	list-style: none;
	position: relative;
}

ul#nav li	{
	float: left;
	zoom: 1;
}

ul#nav a	{
	display: block;
	text-decoration: none;
}

ul#nav li:hover	{
	position: relative;
}

#nav > li.has-children > a	{
	position: relative;
	padding-right: 30px; /* give a little room for the drop-down arrow - this value may need to be overidden */
}

/* this give us the dropdown arrow, drawn in CSS - no need for images :) */
#nav > li.has-children > a:after	{
	content: "";
	position: absolute;
	top: 10px; /* sit the arrow centrally - this value may need to be overidden */
	right: 10px; /* pull the arrow in a bit from the right - this value may need to be overidden */
	height: 0;
	width: 0;
	display: block;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 8px solid rgba(255,255,255,0.6);
}

/* --------------------------------------------   secondary level (dropdown) */

ul#nav ul 	{
	list-style: none;
	width: 220px;
	visibility: hidden;
	position: absolute;
	overflow: visible !important;
	top: 100%;
	left: 0;
	z-index: 800;
	background: #80021C;
}

ul#nav ul li {
	margin: 0;
	float: none;
}

/* IE 6 & 7 Needs Inline Block */
ul#nav ul a	{
	display: inline-block;
	/* background: black; */
	width: 220px;
}

#nav ul li.has-children > a:after	{
	content: "";
	position: absolute;
	top: 18px; /* sit the arrow centrally - this value may need to be overidden */
	right: 10px; /* pull the arrow in a bit from the right - this value may need to be overidden */
	width: 0;
height: 0;
border-style: solid;
border-width: 4px 0 4px 10px;
border-color: transparent transparent transparent #fff;
}

#nav ul li.has-children > a:hover	{
	
}

/* --------------------------------------------   tertiary levels (flyouts) */

ul#nav ul ul 	{
	left: 100%;
	top: 0;
	background: #5d0316;
}

ul#nav li > ul {
	display: none;
}

ul#nav li:hover > ul {
	visibility: visible;
	display: block;
}

/* --------------------------------------------   responsive nav */

a.open-panel, a.close-panel {
	display: none;
	padding: 10px 10px 10px 35px;
	position: absolute;
	top: 0;
	right: 0;
	background: #000;
	color: #fff;
	font-size: 12px;
	line-height: 1;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	background-position: 10px 50%;
	background-repeat: no-repeat;
}

/* -----------------------------------------------------------------------------   blog comments */

#comments	{
	margin-top: 15px;
}

#comments .comment	{
	padding: 15px;
	margin-bottom: 10px;
	overflow: hidden;
}

#comments .author-poster	{
	background: #333;
}

#comments .author-registered	{
	background: #666;
}

#comments .author-anonymous	{
	background: #999;
}

#comments .author-registered .content a	{
	color: #fff;
}

.submitted	{
	font-style: italic;
	margin-bottom: 15px;
	font-size: 12px;
}

#comments p	{
	margin-left: 0;
}

#comments .links	{
	padding: 0;
	margin: 0;
	list-style: none;
}

#comments .links li	{
	background: none;
	padding: 0;
}

#comments .links li a	{
	margin-right: 10px;
	display: block;
	float: left;
	padding: 3px 8px;
	border: none;
	color: #fff;
}

#comments .links li a:active	{
	position: relative;
	top: 1px;
}

#comments .description	{
	font-size: 12px;
}

#comments .box	{
	margin: 20px 0;
	padding: 20px 0;
	border-top: 1px solid #fff;
}

/* -----------------------------------------------------------------------------   blog tags style */

article .tags li, article .terms li	{
	display: inline;
	border: none;
	margin-bottom: 5px;
	background: none;
	line-height: normal;
	padding: 0;
}

article .blog .tags li {
	padding-bottom: 0;
	margin-bottom: 0;
}

article ul.links	{
	padding: 0;
	list-style: none;
}

article ul.links li	{
	float: left;
	margin-bottom: 0;
	border: none;
}

article li.tags ul	{
	display: inline !important;
	padding-left: 0 !important;
	margin: 0;
}

/* -----------------------------------------------------------------------------   blog links style */

.content .links	{
	overflow: hidden;
	margin-top: 10px;
}

.content .links span	{
	float: left;
}

article .blog .links a	{
	margin-right: 10px;
	display: block;
	float: left;
	padding: 3px 8px;
	background: #000;
	border: none;
	color: #fff;
}

article .blog .links a:hover	{
	background: #666;
}

article .blog .links a:active	{
	position: relative;
	top: 1px;
}

body.cke_show_borders, html.CSS1Compat	{
	background: #fff;
}

/* -----------------------------------------------------------------------------   footer */

#footernav	{
	list-style: none;
	float: right;
}

#footernav li {
	float: left;
	margin: 0 0 10px 10px;
}

footer .contact li {
	display: inline-block;
	list-style: none;
	padding-bottom: 15px;
	margin-left: 10px;
}

.footertext, #footernav, footer .contact, p.siteby {
	float: right;
	clear: right;
	vertical-align: top;
	font-size: 14px;
}

/* -----------------------------------------------------------------------------   admin blocks page style */

body.build.block ul#nav	{
	float: none;
}

#block-admin-display-form table	{
	width: 100% !important;
	border-collapse: collapse;
	background: #fff;
}

#block-admin-display-form  td, #block-admin-display-form  th	{
	border: 1px solid #ddd;
}

#block-admin-display-form a	{
	color: #666;
}

#block-admin-display-form  th	{
	text-align: left;
	background: #333;
	color: #fff;
}

.tabledrag-handle	{
	display: block;
	float: left;
	text-decoration: none;
	width: 30px;
}

body.cke_show_borders, html.CSS1Compat	{
	background: #fff;
}

/* -----------------------------------------------------------------------------	lightbox */

#imageDataContainer, #numberDisplay, #caption	{
	font-family: sans-serif;
	font-size: 14px;
	color: #999 !important;
}

#caption	{
	color: #333 !important;
}

#lightbox2-overlay	{
	background: #333 !important;
}

/* -----------------------------------------------------------------------------	downloads */

.downloads {
	background: #ccc;
	padding: 20px;
}

.downloads ul	{
	list-style: none;
	padding-left: 0 !important;
}

.downloads li a	{
	padding: 5px 0 5px 26px;
	display: block;
	background-position: 0 50%;;
	background-repeat: no-repeat;
}

.downloads li a.avi	{
	background-image:  url(../images/downloads/avi.png);
}
.downloads li a.doc, .downloads li a.ord	{
	background-image:  url(../images/downloads/doc.png);
}
.downloads li a.docx	{
	background-image:  url(../images/downloads/docx.png);
}
.downloads li a.mp3	{
	background-image:  url(../images/downloads/mp3.png);
}
.downloads li a.pdf	{
	background-image:  url(../images/downloads/pdf.png);
}
.downloads li a.psd	{
	background-image:  url(../images/downloads/psd.png);
}
.downloads li a.tif	{
	background-image:  url(../images/downloads/tif.png);
}
.downloads li a.txt, .downloads li a.ain	{
	background-image:  url(../images/downloads/txt.png);
}
.downloads li a.wav	{
	background-image:  url(../images/downloads/wav.png);
}
.downloads li a.cel	{
	background-image:  url(../images/downloads/xls.png);
}

/* -----------------------------------------------------------------------------	breadcrumbs */

ol.breadcrumbs	{
	font-size: 13px;
	padding: 4px 0 !important;
	color: #999;
	overflow: hidden;
	margin-bottom: 20px;
}

ol.breadcrumbs li {
	float: left;
	list-style: none;
	padding-left: 0;
}

/* -----------------------------------------------------------------------------   secondary (sidebar) and tertiary content */

body.one-column-layout article	{
	width: auto;
	float: none;
}

body.one-column-layout aside	{
	display: none;
}

body.no-tertiary-content .tertiary-content {
	display: none;
}

/* -----------------------------------------------------------------------------	search form and results */

#search-form label {
	display: inline-block;
	float: left;
	padding: 4px 15px 4px 0;
	font-size: 14px;
}

#search-form input.form-text {
	padding: 5px;
	font-size: 14px;
	margin: 5px 10px 0 0;
}

#search-form .form-item, #search-form input.form-submit {
	display: inline-block;
	float: left;
}

div.box {
	clear: both;
	border-top: 1px solid #000;
	margin-top: 20px;
	float: left;
	width: 100%;
}

ul.search-results {
	list-style: none;
	padding: 0 !important;
}

/* -----------------------------------------------------------------------------    responsive break - tablet portrait display  */

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

	/* hide the to-top button on touch devices */
	/* #totop {display: none !important;}*/

	html.openNav body  {
		background: black;
	}

	/* Move nav off screen, setup transitions */
	nav {
		width: 75%;
		position: absolute;
		right: -75%;
		top: 0;
		height: 100%;
		background: #000;
	}

	/* Display nav items vertically */

	ul#nav li {
		float: none;
		width: 100%;
		text-align: left;
		padding: 0;
		box-sizing: border-box;
		border-bottom: 1px solid #888;
	}

	ul#nav li a {
		padding: 10px;
		width: auto;
		display: block;
	}

	ul#nav ul {
		position: static;
		width: auto;
	}
	
	#nav > li.has-children > a:after {
		top: 25px;
		right: 10px;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-top: 16px solid #777;
	}

	/* Reveal open/close buttons */
	a.open-panel {
		display: block;
		background-image: url(../images/icon-menu.png);
		background-position: 6px 50%;
	}

	.openNav a.open-panel {
		display: none;
	}

	.openNav a.close-panel {
		background-image: url(../images/icon-close.png);
		display: inline-block;
	}

	.openNav #page {
		right: 0;
		-webkit-transform: translate3d(-75%, 0, 0);
		-moz-transform: translate3d(-75%, 0, 0);
		-ms-transform: translate3d(-75%, 0, 0);
		-o-transform: translate3d(-75%, 0, 0);
		transform: translate3d(-75%, 0, 0);
		-webkit-transition: -webkit-transform 500ms ease;
		-moz-transition: -moz-transform 500ms ease;
		-o-transition: -o-transform 500ms ease;
		transition: transform 500ms ease;
	}

	/* When the panel is closed, transition the page back to the right */
	#page {
		right: 0;
		-webkit-transform: translate3d(0, 0, 0);
		-moz-transform: translate3d(0, 0, 0);
		-ms-transform: translate3d(0, 0, 0);
		-o-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
		-webkit-transition: -webkit-transform 500ms ease;
		-moz-transition: -moz-transform 500ms ease;
		-o-transition: -o-transform 500ms ease;
		transition: transform 500ms ease;
	}


	/* stack the footer text bits */

	.footertext, #footernav, footer div.contact, p.siteby, footer div.social {
		float: left;
		clear: left;
		padding: 0 10px;
	}

	.footertext {
		padding-top: 30px;
	}

	.siteby {
		padding-bottom: 30px;
	}

	footer ul.contact li, #footernav li {
		margin: 0 10px 0 0;
	}

	#footernav li {
		margin-bottom: 10px;
	}

	/* stack article and aside(sidebar), kill the floats */

	article, aside {
		float: none !important;
		width: auto !important;
		margin: 0;
	}

	aside {
		margin-top: 30px;
		border-top: 1px solid #000;
	}

	/* ctas that appear in the <aside> - lets get them to stack and position centrally */

	div.ctas {
		clear: both !important;
		float: none !important;
		width: auto !important;
	}

	div.ctas ul.ctas {
		text-align: center;
	}

	div.ctas ul.ctas li {
		float: none !important;
		width: auto !important;
		display: inline-block;
		margin: 20px;
	}

}

/* -----------------------------------------------------------------------------    responsive break - tablet portrait display  */
@media screen and (max-width: 768px)	{

	/* inline images - kill the float, pull them to the left */

	ul.images, ul.images_r {
		float: none !important;
		padding: 0 0 20px !important;
	}

	/* make form inputs/textareas/selects almost full width */

	body.webform .content input,body.webform .content select,body.webform .content textarea {
		width: 90%;
	}

}



/* -----------------------------------------------------------------------------   end style sheet */