/*


Theme Name: Detect Early
Author: Dan Pacey @ Ward 6
Version: 2

Additions:
"Signs of Dementia" Campaign Hero added by Callum, Fri June 05 2015
"3 Link Boxes" section added by Callum, Fri July 31 2015



*/


/* Key Colours

white 		#ffffff
teal		#2dbdb6
black		#111111
grey		#333333

 /* =============================================================================
   CSS Reset
   adapted from html5boilerplate
   ========================================================================== */

/* === HTML5 display definitions === */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


/* === Base === */

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; }
body, button, input, select, textarea { font-family: 'open sans', helvetica, arial, sans-serif; font-size: 12px; line-height: 18px; color: #111; }

::-moz-selection { background: rgba(100,100,100,0.5); color: inherit; text-shadow: none; }
::selection { background: rgba(100,100,100,0.5); color: inherit; text-shadow: none; }


/* === Typography === */

b, strong { font-weight: 600; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #d1d1d1; margin: 0; padding: 0; clear: both; }
small { font-size: 85%; }

h1, h2, h3, h4, h5, h6, p { margin: 0; }

/* subscript/superscript */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.3em; }
sub { bottom: -0.25em; }
h2 sup { font-size: 33%; top: -1.25em;  }


/* === Lists === */

ul, ol { margin: 0; padding: 0; }


/* === Embedded content === */

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }


/* === Forms === */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

label { cursor: pointer; }

legend { border: 0; *margin-left: -7px; padding: 0; }

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }

table button, table input { *overflow: auto; }

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }

/* Consistent box sizing and appearance */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

textarea { overflow: auto; vertical-align: top; resize: vertical; }

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { border-color: #cd382d; background-color: #f8e7e6; color: #222; }


/* === Tables === */

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; font-size: 12px; line-height: 18px; }
td, th { text-align: left; }
th { color: #fff; }

*:focus {
    outline: 0;
}

/* End CSS Reset */


/* =============================================================================

   Basics

   ========================================================================== */


html { height: 100%; overflow-y: scroll; overflow-x: hidden; }

html, body { min-height: 100%; width: 100%; }

body {
	background: #fff;
	height: 100%;
	color: #111;
	margin: 0;
	}

/* default font */
body, button, input, select, textarea { font-family: 'open sans', helvetica, arial, sans-serif; font-size: 14px; }


/* =============================================================================

   Site structure

   ========================================================================== */

#wrap { min-height: 100%; }

#container {
	width: 100%;
	margin: 0px auto;

	clear: left;
	padding-bottom: 100px;
	}

/***** Footer *****/

footer {
	width: 100%;
	margin: 0px auto;
	height: 190px;
	margin-top: -100px;
	position: relative;
	}


/***** Columns *****/

.columns {
	width: 960px;
	margin: 0px auto;
	overflow: hidden;
	}

header .columns { overflow: visible; height: 50px; }

.col1, .col2, .col3, .col4,
.col5, .col6, .col7, .col8,
.col9, .col10, .col11, .col12
	{
	margin: 0px 10px;
	display: block;
	float: left;
	}

.col1   { width:   60px; }
.col2   { width:  140px; }
.col3   { width:  220px; }
.col4   { width:  300px; }
.col5   { width:  380px; }
.col6   { width:  460px; }
.col7   { width:  540px; }
.col8   { width:  620px; }
.col9   { width:  700px; }
.col10  { width:  780px; }
.col11  { width:  860px; }
.col12  { width:  940px; }


.col8.divideLine { width: 617px; border-right: 3px solid #eee; }
.blackFill .padCol1Right.divideLine { padding-right: 77px; border-right: 3px solid #333;  }
.whiteFill .padCol1Right.divideLine { padding-right: 77px; border-right: 3px solid #eee;  }


/* =============================================================================

   Header and Navigation

   ========================================================================== */

header {
	margin: 0px auto;
	overflow: visible;
	padding: 50px 0 0;
	position: relative;
	z-index: 10;
	}

	header .logo {
		background: url('assets/images/logo.png') transparent no-repeat;
		height: 60px;
		}

	header .helpline h2 {
		text-align: right;
		}

.fullWidth.navBackground {
	margin: 30px 0 0;
	background: url("assets/images/white60.png") transparent repeat 0 0;
	background: rgba(255,255,255,0.6);
	}

nav ul { margin: 0; padding: 0; }

nav ul li {
	list-style: none;
	display: block;
	float: left;
	text-align: center;
	margin: 0 1px;
	padding: 0;
	position: relative;
	}

	nav ul li a {
	/*font: 14px/49px 'open sans', helvetica, arial, sans-serif;*/
	font: 13px/49px 'open sans', helvetica, arial, sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	text-align: center;
	letter-spacing: 0.05em;
	padding: 1px 26px 0;
	/*padding: 1px 20px 0;*/
	/*padding: 1px 20px 0\9;*/
	padding: 1px 18px 0;
	height: 100%;
	display: block;
	color: #111111;
	background: url("assets/images/white80.png") transparent repeat 0 0;
	background: rgba(255,255,255,0.8);
	}

	nav ul li a:visited {
		/*color: #111111;*/
		}

	nav ul li a:hover {
		color: #2dbdb6;
		background: #fff;
		}

	nav ul li.current_page_item > a {
		color: #ffffff;
		background: #02938c;
		}



nav ul li ul {
	display: none;
	box-shadow: 1px 2px 2px rgba(0,0,0,0.3);
	position: absolute;
	margin-left: -1px;
	width: 150%;
	}

	nav ul li:hover ul {
			display: block;
			}

	nav ul li ul li {
		float: none;
		width: 100%;
		}

		nav ul li ul li a {
			text-align: left;
			text-transform: none;
			letter-spacing: 0;
			font-weight: 400;
			font-size: 15px;
			line-height: 36px;
			padding: 0 10px;
			border-bottom: 1px solid #ddd;
			background: #fff;
			background: rgba(255,255,255,0.95);
			}

		nav ul li ul li a:visited {
			padding: 0 10px;
			border-bottom: 1px solid #ddd;
			}

		nav ul li ul li a:hover {
			background-color: #2dbdb6;
			color: #fff;
			border-bottom: 1px solid #02938c;
			}

		nav ul li ul li.current_page_item > a {
			border-bottom: 1px solid #02938c;
			}



ul.sideNav, ul.sideNav li {
	margin: 0;
	padding: 0;
	list-style: none;
	display:block;
	width: 100%;
	}

	ul.sideNav li a {
		display: block;
		height: 36px;
		padding: 0 15px;
		margin: 0 0 3px;
		background: #2dbdb6;

		color: #fff;
		text-transform: uppercase;
		font-size: 12px;
		line-height: 36px;
		letter-spacing: 0.15em;


		-moz-transition: all 0.2s linear 0s;
		}

		ul.sideNav li a:hover,
		ul.sideNav li.current_page_item a {
			background: #02938c;
		}




/* =============================================================================

   Footer

   ========================================================================== */


footer { font-family: 'open sans', helvetica, arial, sans-serif; font-size: 11px; line-height: 15px; color: #aaa; }

footer ul.footerLinks, footer ul.footerLinks li { margin: 0px; padding: 0px; }

footer ul.footerLinks { list-style: none; font-weight: 600; margin-bottom: 10px; }

footer ul.footerLinks li { border-bottom: 1px solid #dedbd4; line-height: 20px; list-style-image: none; padding: 0px 0px 0px 2px;}

footer .footerLogo {
	background: url('assets/images/logo.png') transparent no-repeat 0 0;
	height: 59px;
	width: 225px;
	margin: 18px 0px 8px;
	float: left;
	margin: 0px 25px 20px 0px;
	}

footer a.partnerLogo {
	float: left;
	margin: 0px 20px 20px 0px;
	display: block;
	background: url('assets/images/partners.png') transparent no-repeat 0 0;
	height: 59px;
	}

footer a.partnerLogo#ausGov 	{ width: 114px; background-position: 0px 0px; }
footer a.partnerLogo#hacc 		{ width: 101px; background-position: -146px 0px; }
footer a.partnerLogo#nswGov 	{ width: 178px; background-position: -283px 0px; }

/* =============================================================================

   Typography

   ========================================================================== */

p { margin-bottom: 12px; font-weight: 100; }
.tealFill p, .blackFill p { color: #fff; }

sup, sup { font-size: 8px; font-family: 'open sans', helvetica, arial, sans-serif;  }
sup { top: -5px; }



/* headings */

h1, h2, h3, h4, h5, h6 { font-weight: normal; }

h1 p, h2 p, h3 p, h4 p, h5 p, h6 p { margin: 0; padding: 0; }


h1 {
	font: 45px/39px Augustus, arial;
	color: #ffffff;
	text-transform: uppercase;
	margin: -30px 0 0 -30px;
	padding: 30px;
	text-shadow: 0 0 30px rgba(0,0,0,0.4);
	}

h1.teal { color: #2dbdb6; }

h2 {
	font: 22px/20px Augustus, arial;
	margin: 0px 0px 15px;
	color: #2dbdb6;
	text-transform: uppercase;
	padding-top: 3px;
	}

h2 em, h2 strong 	{ font-style: normal; font-weight: normal; color: #2dbdb6 !important; }
.tealFill h2 em 	{ color: #fff !important; }

.whiteFill h2 	{ color: #111111 !important; }
.tealFill h2 	{ color: #111 !important; }
.blackFill h2	{ color: #fff !important; }

footer h2 { margin-bottom: 9px; }


h3 {
	font: 17px/21px 'open sans', helvetica, arial, sans-serif;
	margin: 0px 0px 24px;
	padding-top: 2px;
	color: #2dbdb6;
	}

.blackFill h3 	{ color: #2dbdb6 !important; }
.tealFill h3 	{ color: #fff; }



/* blockquote */

blockquote {
	font: 22px/20px Augustus, arial;
	margin: 30px 0px 20px;
	text-transform: uppercase;
	padding-top: 20px;
	border-top: 3px solid #2dbdb6;
	color: #2dbdb6;
	clear: both;
	}

blockquote p { color: #2dbdb6 !important; margin: 0; }


/* references */

div.references p {
	font: 9px/12px 'open sans', helvetica, arial, sans-serif;
	color: #999;
	}

.blackFill div.references p,
.blackFill div.references p strong	{ color: #666; }



/* =============================================================================

   Links

   ========================================================================== */


a 					{
					text-decoration: none;
					-webkit-transition: 	all 0.1s linear;
					-moz-transition: 		all 0.1s linear;
					-o-transition: 			all 0.1s linear;
					-ms-transition: 		all 0.1s linear;
					transition: 			all 0.1s linear;
					}

a:link 				{ color: #2dbdb6; }
a:visited 			{ color: #2dbdb6; }
a:hover 			{ color: #111111; }
a:active, a.active, .current_page_item a	{ color: #111111; }


.blackFill a:hover { color: #fff; }


footer ul.footerLinks a 			{ display: block; width: 100%; height: 100%; }
footer ul.footerLinks a:link 		{ color: #aaa; }
footer ul.footerLinks a:visited 	{ color: #aaa; }
footer ul.footerLinks a:hover 		{ color: #888; }
footer ul.footerLinks a:active 		{ color: #888; }


a.button {
	color: #fff;
	text-transform: uppercase;
	height: 36px;
	width: auto;
	padding: 0px 15px;
	text-align: left;
	margin: 24px 0px 20px;
    background: #2dbdb6;
	font-size: 12px;
    letter-spacing: 0.15em;
    line-height: 36px;
	display: block;
	display: inline-block;
	-moz-transition: all 0.2s linear 0s;
	clear: both;
	}

a.button:hover {
	background: #111;
	}

.tealFill a { color: #111; }

/* =============================================================================

	Lists

	========================================================================== */


ul {
	margin: 0px 0px 0px 15px;
	}

li {
	padding: 0px 0px 0px 10px;
	margin: 0px 0px 10px;
	}


/* resources page */

.resourcesPage .resourceLists ul {
	margin: 0;
	padding: 0;
	overflow: hidden;
	margin: 10px 0px 30px;
	}

	.resourcesPage .resourceLists ul li {
		margin: 0px 0px 3px;
		padding: 20px 50px 17px 20px;
		list-style: none;

		border-left: 3px solid #ddd;
		background: #f6f6f6;
		-webkit-transition: 	all 0.2s linear;
		-moz-transition: 		all 0.2s linear;
		-o-transition: 			all 0.2s linear;
		transition: 			all 0.2s linear;
		}

	.resourcesPage .resourceLists ul li:nth-of-type(even) { background: #f7f7f7; }

	.resourcesPage .resourceLists ul li:hover { cursor: pointer; background: #e3f2f1; border-left: 3px solid #2dbdb6; }
	.resourcesPage .resourceLists ul li:hover a { color: #111; }


	/*.resourcesPage .resourceLists ul li strong { line-height: 24px; }*/

	.resourcesPage .resourceLists ul li.notExternal a {
		width: 100%;
		height: 100%;
		display: block;
		}



/* =============================================================================

   Page intro

   ========================================================================== */


.fullWidth.pageImage {
	background-image: url('assets/images/image_home_1.jpg');
	background-color: #005854;
	background-repeat: no-repeat;
	background-position: 50% 0;
	background-size: cover;
	height: 330px;
	position: relative;
	top: -50px;
	margin: 0 0 -50px;
	z-index: 5;
	}

	.fullWidth.pageImage .columns {
		overflow: visible;
		}

	.home .fullWidth.pageImage {
		height: 550px;
		}


.pageHeading {
	max-width: 480px;
	position: relative;
	top: 100px;
	}

	.pageHeading h1 {
		width: 120%;
		}

	.pageHeading h2 {
		text-transform: none;
		font: 17px/27px 'open sans', helvetica, arial, sans-serif;
		margin: 0;
		color: #fff;
		background: url("assets/images/darkteal85.png") transparent repeat 0 0;
		background: rgba(0,88,84,0.85);
		display: inline;
		padding: 1px 12px 2px 0;
		width: 600px;
		}

	.home .pageHeading {
		top: 160px;
		}

	.pageHeading br { /* cheeky fix/hack but works in many browsers */
		margin-right: 12px;
		}


/*** tabs ***/

#tabs {
	position: relative;
	overflow: visible;
	height: 200px;
	line-height: 18px;
	}

#tabs section {
	background: #c7efec;
	height: 40px;
	overflow: hidden;
	position: relative;
	top: -20px;
	padding: 20px 40px 20px 20px;
	transition: all 0.5s ease-out;
	cursor: pointer;
	}

	#tabs section:hover {
		background: #fff;
		height: 120px;
		top: -100px;
		transition: all 0.2s ease-out;
		}


	#tabs section h2 a {
		display: block;
		color: #02938c;
		margin: 0 0 21px;
		}

		#tabs section:hover h2 a {
			color: #111;
			}

/* =============================================================================

   Landing video thumbs

   ========================================================================== */


ul.videoThumbs {
	margin: 0px 0px 20px;
	padding: 0;
	clear: both;
	overflow: visible;
	}

ul.videoThumbs li {
	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	display: block;
	margin: 0 5px 5px 0;
	cursor: pointer;
	position: relative;
	}

ul.videoThumbs li img {
	opacity: 0.4;
	-moz-transition: opacity 0.3s linear;
	-webkit-transition: opacity 0.3s linear;
	-o-transition: opacity 0.3s linear;
	-ms-transition: opacity 0.3s linear;
	transition: opacity 0.3s linear;
}

ul.videoThumbs li span {
	display: block;
	bottom: 45px;
	right: 0px;
	position: absolute;
	padding: 10px;
	background: #fff;
	background: rgba(255,255,255,0.85);
	color: #111;
	display: none;
	width: 180px;
	box-shadow: 1px 1px 4px rgba(0,0,0,0.1);
	}


ul.videoThumbs li:nth-of-type(1) span,
ul.videoThumbs li:nth-of-type(2) span,
ul.videoThumbs li:nth-of-type(6) span,
ul.videoThumbs li:nth-of-type(7) span {
	right: auto;
	left: 0px;
	}

ul.videoThumbs li:nth-of-type(3) span {
	right: auto;
	left: -73px;
	}



ul.videoThumbs li.active img, ul.videoThumbs li:hover img {
	opacity: 1;
}


section.videoMeta {
	height: 348px;
	position: relative;
	}

section.videoMeta div {
	position: absolute;
	bottom: -5px;
	}

.introHeading { position: relative; top: 10px; }

/* mediaElement */

.mejs-overlay-loading { display: none; }

/* 	=============================================================================

	Video sliders

	========================================================================== */


#slider {
	width: 620px;
	height: 348px;
	overflow: hidden;
	position: relative;
}

#slideContainer {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 3780px;
	}

#slider #slideContainer div.slide {
	float: left;
	margin: 0px 10px 0px 0px;
	}


/* =============================================================================

   managing diabetes download list

   ========================================================================== */

.accordian {
	border-bottom: 3px solid #eee;
	padding: 0 0 3px;
	margin: 0 10px 18px 0;
	}

.accordian ul.downloads {
	display: none;
	}

.accordian.active ul.downloads {
	display: block;
	}


.accordian h2 {
	height: 20px;
	background: url('assets/images/toggle.png') transparent no-repeat 100% -20px;
	color: #2dbdb6 !important;
	-webkit-transition: color 0.2s linear;
	-ms-transition: color 0.2s linear;
	-moz-transition: color 0.2s linear;
	-o-transition: color 0.2s linear;
	transition: color 0.2s linear;
	cursor: pointer;
	}

.accordian.active h2 {
	background: url('assets/images/toggle.png') transparent no-repeat 100% 0px;
	color: #111111 !important;
	}

.accordian h2:hover { color: #111111 !important; }

ul.downloads,
ul.downloads li { /* reset */
	margin: 0;
	padding: 0;
	list-style: none;
	}

ul.downloads {
	margin: 20px -5px 0px -5px;
	width: 620px;
	overflow: hidden;
	}

ul.downloads li {
	width: 280px;
	display: block;
	float: left;
	padding: 20px 10px 7px;
	position: relative;
	margin: 0px 5px 10px;
	border-bottom: 3px solid #eee;
	background: #f6f6f6;
	height: 150px;
	overflow: hidden;
	}

ul.downloads.placard {
	width: 100%;
	}

ul.downloads.placard li {
	width: auto;
	float: none;
	height: initial;
	overflow: initial;
	}

ul.videos li:hover {
	cursor: auto !important;
	background: #f6f6f6 !important;
	border-left: 3px solid #ddd !important;
	}

ul.videos iframe {
	max-width: 100%;
	width: 100%;
	margin-top: 15px;
}

ul.downloads li img, ul.downloads span.placeholder {
	width: 100px;
	height: 140px;
	background: #fff;
	margin: 1px 0px 10px 20px;
	box-shadow: 1px 2px 5px rgba(0,0,0,0.2);
	float: right;
	-moz-transition: all 0.2s ease-out;
	-webkit-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	}

ul.downloads li img:hover, ul.downloads span.placeholder:hover {
	-moz-transform: scale(1.04);
	-webkit-transform: scale(1.04);
	-o-transform: scale(1.04);
	}

ul.downloads span.placeholder {
	display: block;
	background: url('assets/images/graphic_pdf_placeholder.gif') #fff no-repeat 0 0;
	height: 124px;
	width: 78px;
	padding: 16px 10px 0 12px;
	/*overflow: hidden;*/
	font: 5px/5px 'Augustus';
	color: #111;
	text-transform: uppercase;
	}

ul.downloads h3 {
	margin: 0px 0px 10px;
	height: 65px;
	overflow: hidden;
	font-size: 16px;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

ul.downloads form {
	position: absolute;
	bottom: 11px;
	left: 10px;
	overflow: hidden;
	width: 160px;
	}

ul.downloads select {
	width: 120px;
	margin: 0px 0px 5px;
	background: #fff;
	color: #666;
	padding: 8px 9px 8px 5px;
	text-indent: 2px;
	border: 1px solid #eee;
	float: left;
	}


ul.downloads select.disabled {
	background: #f6f6f6;
	color: #999;

	}



ul.downloads input[type="submit"] {
	width: 34px;
	padding: 0px 0px 0px 2px;
	float: right;
	margin: 0px;
	height: 34px;
	top: 1px;
	position: relative;
	text-align: center;
}


ul.downloads label { text-align: left; }

/* =============================================================================

   wp_polls style

   ========================================================================== */

.wp-polls {
	margin-bottom: 30px;
	padding-bottom: 18px;
	border-bottom: 1px solid #eee;
	}

ul.wp-polls-ul, ul.wp-polls-ul li {
	margin: 0;
	padding: 0 0 0 5px;
	}

ul.wp-polls-ul {
	margin: 15px 0px 30px;
	}

ul.wp-polls-ul li {
	margin: 0px 0px 10px;
	}


ul.wp-polls-ul li .pollbar {
	margin-top: 5px;
	}

.button.pollButton {
	width: auto;
	padding: 0px 20px;
	margin: 0pc 30px 0px 0px;
	float: left;
	position: relative;
	top: -8px;
	color: #fff;
	background: #2dbdb6;
	}

.button.pollButton:hover {
	background: #111;
	}

.wp-polls label {
	float: none;
	padding-left: 15px !important;
}

.wp-polls input[type="radio"] {
	float: left;
	position: relative;
	top: -3px;
	}

/* =============================================================================

   Helpers and other reusables

   ========================================================================== */


.helplineCallout {
	background-color: #d5f2f0;
	padding: 20px 20px 0;
	margin: 30px 0 20px;
	}

.block { display: block !important; }
.relative { position: relative; }

img.leftFloat, .col7 img { margin: 5px 20px 20px 0px; float: left; }
img.rightFloat { margin: 0px 0px 20px 20px; }

.fullWidth { /* for 100% wide panels. Use to wrap the column div */	width: 100%; }

.ruler {
	line-height:20px;
	height: 20px;
	padding: 0;
	position: absolute;
	bottom: 0px;
	background: url("assets/images/darkteal50.png") transparent repeat 0 0;
	background: rgba(2,147,140,0.5);
	}

	.home .ruler {
		height: 60px;
		line-height: 60px;
		}

.topPad50 		{ padding-top: 50px; }
.topPad40 		{ padding-top: 40px; }
.topPad30 		{ padding-top: 30px; }
.topPad20 		{ padding-top: 20px; }
.topPad10 		{ padding-top: 10px; }

.bottomPad10 	{ padding-bottom: 10px; }
.bottomPad20 	{ padding-bottom: 20px; }
.bottomPad30 	{ padding-bottom: 30px; }

.bottom30 		{ margin-bottom: 30px; }
.top10 		    { margin-top: 10px !important; }


hr 				{ border-color: #eceae6; }


/* colours */
.white 			{ color: #ffffff; }
.black			{ color: #111111; }
.grey			{ color: #333333; }
.teal			{ color: #2dbdb6 !important; }


/* backgrounds */
.whiteFill 		{ background: #fff; }
.tealFill 		{ background: #2dbdb6; }
.blackFill		{ background: #111111; }


.textHidden 	{ text-indent: -9999px; }

.textCenter 	{ text-align: center; }
.textRight 		{ text-align: right; }

.blockLink 		{ display: block; width: 100%; height: 100%; }

.rightFloat 	{ float: right; }
.leftFloat		{ float: left; }
.noFloat 		{ float: none !important; }

span.lowerCase 	{ text-transform: lowercase; }

.only480 		{ display: none; }

.clearBoth 		{ clear: both; }

.u-sizeFit {
  display: block !important;
  float: left !important;
  width: auto !important;
}

.u-sizeFill {
  display: block !important;
  overflow: hidden !important;
  width: auto !important;
}

.u-floatLeft {
  float: left !important;
}

/* =============================================================================

   Forms

   ========================================================================== */


form { margin: 16px 0px 0px; }

/* reuqired field asterisk */
span.reqd {
	color: #cd382d;
	font-size: 11px;
	font-weight: 400;
	position: relative;
	top: -3px;
	}

input, select, textarea {
	padding: 0px 15px;
	font: 13px/36px arial, helvetica sans-serif;
	color: #888;
	height: 36px;
	background: #f6f6f6;
	border: 1px solid #ccc;
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	transition: all 0.3s linear;
	margin: 0px 0px 9px;
	}


input:hover, textarea:hover, select:hover {
	border-color: #666;
	color: #666;
	}

input:focus, textarea:focus, select:focus {
	background: #fff;
	border-color: #888;
	color: #222;
	}


.blackFill input, .blackFill select, .blackFill textarea {
	color: #ccc;
	background: #333;
	border: 1px solid #393939;
	}

.blackFill input:hover, .blackFill textarea:hover, .blackFill select:hover {
	border-color: #555;
	color: #eee;
	}

.blackFill  input:focus, .blackFill textarea:focus, .blackFill select:focus {
	background: #fff;
	border-color: #888;
	color: #333;
	}

input[type="checkbox"] {
	float: left;
	clear: both;
	margin-right: 20px;
	padding: 0;
	border: 0;
	width: auto;
	background: transparent;
	}

input[type="radio"] { width: auto; background: transparent; }

select {

	border-radius: 0;
	padding: 8px 8px 8px 10px; }

select option {
	height: 20px;
	padding: 8px 0px 2px 10px;
	border-bottom: 1px solid #ececea;
	cursor: pointer;
	color: #555;
	}

select option:nth-of-type(even) { background: #f8f8f8; }


textarea  {
	height: 84px;
	min-height: 84px;
	line-height: 18px;
	padding-top: 10px;
	padding-right: 0px;
	}

input[type="submit"] {
	height: 36px;
	padding: 0px 15px;
	text-align: left;
	margin-top: 14px;
    background: #2dbdb6;
	border: 1px solid #2dbdb6;
	font-size: 11px;
    letter-spacing: 0.15em;
    line-height: 36px;
    text-transform: uppercase;
	color: #fff;
	-moz-transition: all 0.2s linear 0s;
	}

input[type="submit"]:hover {
	background: #111;
	border: 1px solid #111;
	}

.blackFill input[type="submit"] {
	background: #111;
	border: 1px solid #333;
	width: 300px;
	}

.blackFill input[type="submit"]:hover {
	background: #2dbdb6;
	border: 1px solid #2dbdb6;
	}


input[type="submit"].inlineFormButton {
	margin-left: 180px;
	}


label {
	font: 14px/30px 'open sans', helvetica, arial, sans-serif;
	font-weight: 600;
	display: block;
	width: 140px;
	margin-right: 40px;
	float: left;
	text-align: right;
	}


.blackFill label { color: #fff; }


#registerForm label { text-align: left; width: auto; }

#registerForm input,
#registerForm textarea,
#registerForm select {
	width: 268px;
	}


/* contact form 7 specifics */

div.wpcf7 img.ajax-loader { float: none; position: relative; top: 8px; left: 12px; }

span.wpcf7-not-valid-tip {
	background: #cd382d !important;
	color: #fff !important;
	border: 0 !important;
	left: -20px !important;
	top: 90% !important;
	font-size: 13px !important;
	padding: 3px 12px 4px 6px !important;
	width: auto !important;
	display: block;
	z-index: 100;
	margin: 0;
	}

.wpcf7-validation-errors {
	background: #cd382d !important;
	color: #fff !important;
	border: 0 !important;
	display: none !important;
	}

.wpcf7-mail-sent-ok {
	border: 1px solid #83bc40 !important;
	background: #ecf6e1 !important;
	color: #222 !important;
	border: 0 !important;
	}


div.wpcf7-response-output {
	margin: 30px 40px 10px !important;
	padding: 12px !important;
	}

/* ==========================================================================

   Visitor survey July 2014

   ========================================================================== */

#visitorSurvey {
    height: 440px;
}

.popup {
    position: fixed;
    display: none;

    opacity: 0;

    transition: opacity 1.0s linear;
	-webkit-transition: opacity 1.0s linear;
	-moz-transition: opacity 1.0s linear;
	-o-transition: opacity 1.0s linear;
	-ms-transition: opacity 1.0s linear;
}

.popup.active {
    opacity: 1;

    transition: opacity 0.5s linear 0.2s;
	-webkit-transition: opacity 0.5s linear 0.2s;
	-moz-transition: opacity 0.5s linear 0.2s;
	-o-transition: opacity 0.5s linear 0.2s;
	-ms-transition: opacity 0.5s linear 0.2s;
}

.popup.visible {
    display: block;
}

    .popup.content {
        z-index: 201;
        top: 20%;

        background-color: #fff;
    }

    .popup.content.half-screen {
        width: 860px;
        left: 50%;
        margin-left: -480px;
        padding: 40px;
    }

    .popup.overlay {
        z-index: 200;

        width: 100%;
        height: 100%;

        left: 0;
        top: 0;

        background-color: #000;

        transition: opacity 1.0s linear 0.3s;
        -webkit-transition: opacity 1.0s linear 0.3s;
        -moz-transition: opacity 1.0s linear 0.3s;
        -o-transition: opacity 1.0s linear 0.3s;
        -ms-transition: opacity 1.0s linear 0.3s;
    }

    .ie7 .popup.overlay,
    .ie8 .popup.overlay {
        background-color: transparent;
        background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEUlEQVQImWNgYGD4z4AE/gMADwMB/414xEUAAAAASUVORK5CYII=) repeat;
    }

    .popup.overlay.active {
        opacity: 0.4;

        transition: opacity 0.3s linear 0s;
        -webkit-transition: opacity 0.3s linear 0s;
        -moz-transition: opacity 0.3s linear 0s;
        -o-transition: opacity 0.3s linear 0s;
        -ms-transition: opacity 0.3s linear 0s;
    }

    .ie7 .popup.overlay.active,
    .ie8 .popup.overlay.active {

    }

    #visitorSurvey header {
        padding: 10px 0 0 0;
    }

        #visitorSurvey header.thank-you {
            margin: 160px auto 0 auto;
        }

        #visitorSurvey form.dismiss label {
            height: 0;
            opacity: 0;
            margin: 0;
            padding: 0;

            overflow: hidden;
        }

    #visitorSurvey #dismissPermanently {
        background-color: #555;
        padding: 6px 20px;
        color: #ffffff;
        position: absolute;
        right: 10px;
        top: -30px;
        opacity: 0.8;
        font-size: 12px;
    }
        #visitorSurvey #dismissPermanently:hover { opacity: 1; }
        #visitorSurvey #dismissPermanently:active { background-color: #333; }

            #visitorSurvey header.thank-you #dismissPermanently {
                -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
                filter: alpha(opacity=0);
                opacity: 0;

            }

    #visitorSurvey #dismissImmediately {
        color: #555;
        font: 20px/24px "open sans";
        position: absolute;
        top: -30px;
        right: -20px;
        opacity: 0.8;
    }
        #visitorSurvey #dismissImmediately:hover { opacity: 1; }
        #visitorSurvey #dismissImmediately:active { color: #333; }

        #visitorSurvey header.thank-you #dismissImmediately {
                top: -180px;
            }

    #visitorSurvey h2 {
        font-size: 36px;
        line-height: 90%;
        margin-bottom: -10px;
    }

        #visitorSurvey h2 span {
            color: #000;
            display: block;
        }

        #visitorSurvey h2 small {
            font-size: 45%;
            position: relative;
            top: -12px;
        }

    #visitorSurvey form {
        margin-top: 0;
    }

        #visitorSurvey form p.error {
            -moz-transition:
                height 0.3s linear,
                padding 0.3s linear;
            -webkit-transition:
                height 0.3s linear,
                padding 0.3s linear;
            -o-transition:
                height 0.3s linear,
                padding 0.3s linear;
            -ms-transition:
                height 0.3s linear,
                padding 0.3s linear;
            transition:
                height 0.3s linear,
                padding 0.3s linear;

            position: absolute;
            right: 40px;
            bottom: 120px;
            width: 160px;
            font-size: 85%;
        }

    #visitorSurvey label {
        display: inline-block;
        width: 47%;
        margin: 0;
        padding: 0;
        text-align: left;

        position: relative;
    }

        #visitorSurvey label p.error {

            position: absolute;
            top: 66px;
            bottom: auto;
            right: auto;

            background: #FFCCCC;
            line-height: 12px;
            width: 60%;
            font-size: 85%;

            height: 0;
            padding: 0 2%;
            overflow: hidden;
        }

        #visitorSurvey label.error p.error {
            height: auto;
            padding: 7px 2%;
        }

    #visitorSurvey input,
    #visitorSurvey select {
        display: block;
        width: 64%;

        margin: 12px 0;
    }

        #visitorSurvey label.error input,
        #visitorSurvey label.error select {
            margin: 0 0 24px 0;
        }

    #visitorSurvey input { width: 56%; }

    #visitorSurvey select:disabled {
        cursor: not-allowed;
    }

        #visitorSurvey label.loading {

        }

        #visitorSurvey label.loading select {
            cursor: wait;
            background-color: #fff;
        }

    #visitorSurvey footer {
        margin: 0;

        position: absolute;
        left: 40px;
        bottom: 0;

        width: 860px;
        height: 110px;
    }

        #visitorSurvey footer img,
        #visitorSurvey footer p,
        #visitorSurvey footer input{ display: inline-block; }

        #visitorSurvey footer img {
            padding: 0;
            vertical-align: middle;
        }

        #visitorSurvey footer p {
            width: 420px;
            padding: 20px;
            vertical-align: middle;
        }

        #visitorSurvey input[name="submit_btn"] {
            font-size: 12px;
            text-align: center;
            width: 160px;
            margin: 0;
            padding: 24px 0 34px 0;
            vertical-align: middle;
            line-height: 12px;
        }

/* ==========================================================================

   Media Queries

   ========================================================================== */

@media only screen and (max-width: 1154px) {
	body { margin: 0; }
}


@media only screen and (min-device-width : 561px) and (max-width: 768px) {



	.columns, header, footer {
		width: 768px;
		}


	.col12, .col8 		{ width: auto; }
	.col8.divideLine	{ width: 732px; border-right: 0px; }
	.col6 				{ width: 364px; }
	.col4.logo,
	.managing-dementia .col4.logo 			{ width: 366px; }
	.col7				{ width: 384px; }


	#tabs .col4 { width: 250px; margin: 0 3px; }
	#tabs .col4 h2 { white-space: nowrap; }


	#tabs section { padding: 20px; }
	#tabs section:hover { height: 140px; top: -120px;}

	#container .col8.helpline { width: 362px; }

	.whiteFill .padCol1Right.divideLine, .blackFill .padCol1Right.divideLine { padding-right: 41px; }


	nav ul li a:link	{ padding: 1px 8px 0 !important; }


	ul.downloads {
		width: 732px;
		}

	ul.downloads li {
		width: 300px;
		padding: 20px 20px 7px;
		margin: 0px 10px 20px;
		}

	ul.downloads form {
		left: 20px;
		}




	.videoPanel .col8 { width: 748px; text-align: center; }
	.videoPanel .col4 { width: auto; }

	#slider { margin: 0 auto; }

	section.videoMeta { height: auto; padding-top: 20px; }
	section.videoMeta div { position: relative; bottom: auto; }

	.pageHeading h2 { width: auto; }

	.managing-dementia .col4 {
		width: 748px;
		}

	label { width: auto; float: none; text-align: left; }
	input.inlineFormButton[type="submit"] { margin-left: 0; }
}


@media only screen and (max-width: 560px) {
  /* for viewports 480px and under */


  	.not480 { display: none; }
  	.only480 { display: block; }

  	body { margin: 0; }

	.columns, header, footer {
		width: auto;
		}


	.col4.logo { width: 279px; background-position: 50% 0; }

	.col12, .col8, .col7, .col6 { width: 100%; margin: 0;}

	#tabs, .helpline { display: none; }

	header .columns { height: auto; overflow: hidden; }

	nav ul { overflow: hidden; margin: 20px 0 0; }

	nav ul li {
		list-style: none;
		display: block;
		float: none;
		text-align: left;
		margin: 0px;
		padding: 0px;
		width: 100%;
		border-bottom: 3px solid #eee;
		}

	nav ul li a:link {
		padding: 12px 5px 12px !important;
		line-height: 18px;
	}


	input, select, textarea { width: 258px; outline: 0; }
	input[type="submit"] { width: 290px; }

	.padCol1Right { padding-right: 0px !important; }
	.padCol1Right.divideLine { padding-right: 0px !important; border-right: none !important;  }


	footer .footerLogo,
	footer a.partnerLogo {
		display: block;
		float: none;
		margin: 15px 0;
		}

	ul.downloads {
		width: 400px;
		}

	.videoPanel .col8 { width: auto; text-align: center; }
	.videoPanel .col4 { width: auto; }

	#slider { margin: 0 auto; }

	section.videoMeta { height: auto; padding-top: 20px; }
	section.videoMeta div { position: relative; bottom: auto; }


	.fullWidth.pageImage { top: 0px; margin: 0px; }

	.pageHeading { top: 50px; }

	.pageHeading h1 {
		width: auto !important;
		font: 39px/33px Augustus,arial  !important;
		}

	.pageHeading h2 { width: auto; }
	.pageHeading h2 br { display: none; }



	.managing-dementia .fullWidth .col4 {
		width: auto;
		}

	label { width: auto; float: none; text-align: left; }
	input.inlineFormButton[type="submit"] { margin-left: 0; }



}



/*

    Managing the double-line title of the list of pdfs.
    Managing the 'early signs of dementia' list on the resources page.
    Written by Cynthia, Thurs June 11 2015.

*/

.accordian.doubleLine {
    padding-bottom: 20px;
}

.accordian.doubleLine hgroup {
    height: 40px;
}

ol.managingList {
   counter-reset: item;
   margin-left: 0;
   padding-left: 0;
   border-bottom: 3px solid #eee;
   padding: 0 0 15px;
   margin: 0 10px 18px 0;
}
ol.managingList li {
   display: block;
   margin-bottom: .5em;
   margin-left: 2em;
}
ol.managingList li:before {
   display: inline-block;
   content: counter(item) ". ";
   counter-increment: item;
   width: 2em;
   margin-left: -2em;
   text-align: right;
   padding-right: 10px;
}



/*

	Hero for the new "Signs of Dementia" Campaign.
	Written by Callum, Fri June 05 2015.
	Namespaced '.signsCampaign' at the '.fullWidth.pageImage' home hero div.

*/

.navBackground--noBg,
.ruler--noBg {
    background: none !important;
}

.signsCampaign_ {
    /* background-image:-webkit-linear-gradient(top,#36a49e 0%,#1f5e5a 100%) !important; */
    /* background-image:linear-gradient(to bottom,#36a49e 0%,#1f5e5a 100%) !important; */

    background: #36a49e !important; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzM2YTQ5ZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxZjVlNWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) !important;
    background: -moz-linear-gradient(top,  #36a49e 0%, #1f5e5a 100%) !important; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#36a49e), color-stop(100%,#1f5e5a)) !important; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #36a49e 0%,#1f5e5a 100%) !important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #36a49e 0%,#1f5e5a 100%) !important; /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #36a49e 0%,#1f5e5a 100%) !important; /* IE10+ */
    background: linear-gradient(to bottom,  #36a49e 0%,#1f5e5a 100%) !important; /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#36a49e', endColorstr='#1f5e5a',GradientType=0 ) !important; /* IE6-8 */
}

.signsCampaign .columns,
.signsCampaign .col12 {
    height: 100%;
}

.signsCampaign .col12 > section {
    position: relative;
    top: 15%;
    height: 64%;}

.signsCampaign .pageHeading {
 /*   background-image: url('http://detectearlyqa.w6digital.com.au/wp-content/uploads/2015/06/hero-detectSigns-carAmbience.jpg'); */
    box-sizing: border-box;
    float: left;
    height: 100%;
    padding: 20px;
    top: 0;
    width: 506px;
    width: 53.7234043%;
    max-width: 53.7234043%;

    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -webkit-flex-direction:column;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-pack:center;
    -webkit-justify-content:center;
    -ms-flex-pack:center;
    justify-content:center
}

.signsCampaign .pageImage {
  /*  background-image: url('http://detectearlyqa.w6digital.com.au/wp-content/uploads/2015/06/hero-detectSigns-car.jpg'); */
    float: right;
    /* height: 460px; */
    height: 100%;
    overflow-y: hidden;
    width: 434px;
    width: 46.2765957%;

}

.signsCampaign .pageImage img {
    width: 100%;
}

.signsCampaign .pageHeading h1 {
   /* color: #27968f; */
    font-size: 36px;
    letter-spacing: -0.02em;
    line-height: 32px;
    margin: 0 0 20px 0;
    padding: 0;
    text-shadow: none;
    width: auto;
}

.signsCampaign .pageHeading h2 {
    background: none;
  /*  color: #111; */
    font-size: 19px;
    letter-spacing: -0.02em;
    line-height: 25px;
    padding: 0;
}

.signsCampaign .pageHeading h2:after {
    border-top: 6px solid transparent;
	border-left: 10px solid #fff;
	border-bottom: 6px solid transparent;
    content: "";
    display: inline-block;
	/* height: 18px; */
    margin-left: 6px;
    position: relative;
    /* width: 12px; */
}

.signsCampaign .pageHeading h2 a,
.signsCampaign .pageHeading h2 a:link,
.signsCampaign .pageHeading h2 a:active
.signsCampaign .pageHeading h2 a:hover {
  color: #fff;
  text-decoration:underline;
}

.signsCampaign .pageHeading h2 span {
    font-weight: 800;
}

/*

	"Three Boxes" link section.
	Written by Callum, Fri July 31 2015.
	Namespaced '.threeBoxes'.

*/

.threeBoxes {
	background-color: #2dbdb6;
	background-image: -webkit-radial-gradient( #218781, #2dbdb6 );
	background-image: radial-gradient( #218781, #2dbdb6 );
	padding: 60px 0;
}

.threeBoxes .col4 {
	background-color: white;
	box-sizing: border-box;
	padding: 31px 33px 0;
}

.threeBoxes img {
	max-width: 100%;
}

.threeBoxes p {
	border-top: 1px solid #c5c5c5;
	color: #757575;
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 0.02em;
	line-height: 1.4;
	margin: 31px auto 0;
	min-height: 54px;
	padding: 14px 0 17px;
	text-align: center;
}

.threeBoxes p span {
	border-color: transparent transparent transparent #888;
	border-style: solid;
	border-width: 5px 0 5px 9px;
	display: inline-block;
	font-size: 50%;
	height: 0;
	margin-left: 3px;
	position: relative;
	top: 4px;
	width: 0;
}

.threeBoxes p i {
	font-size: 80%;
}