/*
Theme Name: Spark Psychology
Theme URI: http://sparkpsychology.ca
Author: DesignGoblin
Author URI: http://www.designgoblin.com/
Description: This is a responsive theme created for WordPress 5+
Version: 1.0
Tags: responsive-layout, custom-menus, fixed nav
Text Domain: designgoblin

Spark Psychology Theme ©2021 DesignGoblin
*/

.redborder {border:1px solid red;}

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
  -webkit-text-size-adjust: 100%;
}

html {overflow-y: scroll;position:static!important;top:0!important;}
html, body {
  height: 100%;
  margin:0;
}

#content .col {padding:30px!important;}

.small {font-size: 80%;line-height:normal;}
.medium {font-size: 130%;line-height:normal;font-weight:300;}
.large {font-size: 150%;line-height:normal;}
.center {text-align: center;}
.center img {margin:0 auto!important;}
.nopad {padding:0!important;}

.left {float:left;}
.right {float:right;text-align:right;}
.half {width:50%;}

.pad5 {padding:0 5%!important;}
.pad10 {padding:0 10%!important;}
.pad20 {padding:0 20%!important;}
.pad30 {padding:0 30%!important;}





/* responsive images //////////////////////////////////////////////////////////////////// */
img {
  max-width: 100%;
  max-width: auto;
  height: auto;
}


/* RESET /////////////////////////////////////////////////////////////////////////////// */

hr {margin:3em 0 2.5em 0; border-width: 0;border-top: 1px solid #E1E1E1; clear:both;}


/* responsive embeds //////////////////////////////////////////////////////////////////// */

.embed {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 ratio */
  height: 56.25%;
  overflow: hidden;
  padding-top: 0;
  padding-right: 0;
  padding-left: 0;
  top: 10px;
}
.video {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
    /*margin:50px 0;*/
    border:10px solid #FFF;
    /*box-shadow: 0px 2px 12px #CCC;*/
}
.video iframe,
.video object,
.video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Typography /////////////////////////////////////////////////////////////////////////// */
body {
  font-family: "Open Sans", Arial, sans-serif;
  font-weight:500;
  font-size: 16px;
  line-height: normal;
  color: #555;
  background: #EEE;
}

a:link, a:visited, a:active {
  text-decoration: none;
  color: #0CC;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}
a:hover {color: #CCC;}



h1, h2, h3, h4, h5, h6 {margin:1.5em 0 .55em 0;font-weight:700;color:#444;line-height:1.3em;clear:both;}
h1 {font-size:2em;letter-spacing: -.01em;text-align:center;}
h2 {font-size:1.65em;text-transform: uppercase;margin-top:2em;}
h3 {font-size:1.5em;}
h4 {font-size:1.3em;}
h5 {font-size:1.1em;margin:1.5em 0 .85em 0;}
h6 {font-size:1.1em;text-transform: uppercase;font-weight:500;color: #9e9b94;letter-spacing:0.175em;padding-bottom:10px;}


ul, ol {
  list-style-type: disc;
  padding: 0 0 30px 20px;
}
ul ul, ol ol {
  list-style-type: disc;
  padding-bottom:5px;
}
li {
  margin-bottom: 10px;
}

blockquote {
    padding:1.2em 10% 0 10%;
    border-top:1px solid #e5e5e5;
    margin:2em 0 0 0;
    font-size: 1.5em;
    font-style: italic;
    font-weight:300;
    line-height:1.4em;
    color:#999;color: #9E9B94;
  clear:both;
}
blockquote p {margin:0!important;}
cite {
  width:100%;
  display:block;
  font-style:italic;
  font-size:.85em;
  text-align:center;
  padding:0 10% 1.5em 10%; 
  margin:0 0 2em 0;
  border-bottom:1px solid #e5e5e5;
}

.spark-green {background: rgba(201,209,9);}
.spark-orange {background: rgba(255,134,2);}
.spark-gold {background:rgba(255,199,0);}
.spark-purple {background:rgba(102,95,141);}
.spark-aqua {background: #0CC;}

.spark-text-green {color:rgba(201,209,9);}
.spark-text-orange {color:rgba(255,134,2);}
.spark-text-gold {color:rgba(255,199,0);}
.spark-text-purple {color:rgba(102,95,141);}
.spark-text-aqua {color:#0CC;}






/*SECTIONS //////////////////////////////////////////////////////////////////////// */

.container {
  position: relative;
  height:100%;
  max-width:1440px;
  margin:0 auto;
  padding:0 2%;
}



section .container {overflow: hidden;}
section {
	padding:3% 0;
	display:table;
	width:100%;
	background:#fff;
}
section.grey {background:#f5f5f5;}
section#home-about {padding-bottom:0;}

header {
  display:table;
  width:100%;
	/*position:fixed;*/
	position:absolute;

	z-index:9999;
	/*border-bottom:1px solid rgba(255,255,255,0.2);*/
}

#banner {
  width:100%;
  background:#c1c1c1;
	min-height:300px;
}

#cta {
	/*background: rgba(30,159,162);*/
	background: url(images/cta2.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position:center;
	color:#FFF!important;
	text-align:center;
}
#cta h1 {color:#fff;margin-top:0!important;}

.logo, .logo_rev {padding:10px 0;}
.logo img, .logo_rev img {max-width:150px;}






.topbar {
	padding:25px 20px 0 20px;
	color:#fff;
	font-size:0.75em;
	line-height:normal;
	text-align:right;
}

.topbar .button a {
  border:2px solid rgba(255,255,255,0.5);
  color:#fff;
}
.topbar .button a:hover,.topbar.button a:active {background:rgba(0,0,0,0.05);border-color:#fff;}



/* NAVIGATION //////////////////////////////////////////////////////////////////////////////// */

.mainnav {margin:0;}

#nav-trigger {
  display: none;
  position:absolute;
  right:20px;top:10px;
}
/* hidden menu button */
#nav-trigger span  {
    display: inline-block;
    padding: 5px 10px;
    color: #fff;
    cursor: pointer;
    font-size: 30px;
    background:transparent;
    z-index: 9999;
}




nav {z-index: 100;height:100%;}

/*main nav */
nav#nav-main {
  margin:0;
  position:relative;


}
nav#nav-main ul {
  list-style:none;
  position:relative;
  margin:32px 0 0 0;
  padding:0;
}
nav#nav-main ul a {
  display:block;
  color:#FFF;
  text-decoration:none;
  font-weight:600;
  font-size:.85em;
  letter-spacing: .05em;
  padding:20px 15px;
  text-transform:uppercase;
  text-shadow: 0px 2px 6px rgba(0,0,0,0.4);
}
nav#nav-main ul li {
  position:relative;
  float:left;
  margin:0;
  padding:0;
}

nav#nav-main ul li:hover a {
  color:#3FF;
  cursor: pointer;
  text-shadow: none;
}

.lastitem {display:none;}


/* Dropmenu */
nav#nav-main ul ul {
  display:none;
  position:absolute;
  top:100%;
  left:0;
  padding:0;
  text-align:left;
  border-top:none;
  z-index:9999;
	margin:0;
}
nav#nav-main ul ul li { float:none; width:200px;}
nav#nav-main ul ul a{
  line-height:120%;
  padding:7px 10px;
  margin:0;
  font-weight:400;
  font-size:.8em;
  letter-spacing:normal;
  text-transform:none;
  color:#fff!important;
  background:rgba(0,0,0,0.4);
}
nav#nav-main ul li:hover > ul { display:block;}
nav#nav-main ul ul li:hover a { background:rgba(0,0,0,0.5)!important;text-shadow: none;color:#fff!important;*/}





/* MOBILE nav  ///////////////////////////////////////////////////////////////////// */

nav#nav-mobile {
    position: relative;
    display: none;
    clear:both;
  width:100%;
}
nav#nav-mobile ul {
    display: none;
    list-style-type: none;
    position: absolute;
    left: 0;
    right: 0;
    margin:0;
    padding:0;
    text-align: center;
    width:100%;
    -webkit-box-shadow: 0px 10px 10px 0px rgba(0,0,0,0.15);
    -moz-box-shadow: 0px 10px 10px 0px rgba(0,0,0,0.15);
    box-shadow: 0px 10px 10px 0px rgba(0,0,0,0.15); 
}
nav#nav-mobile li {
    display: block;
    padding: 0;
    margin: 0;
    background:#FFF;
    border-top:1px solid #EEE;
}
nav#nav-mobile li a {
    display: block;
    padding: 8px 20px;
    color:#555;
    text-transform:uppercase;
    font-size:1em;
    font-weight:600;
}

/* contact highlight */
nav#nav-mobile li.contact a {
	background:#0CC;
	color:#fff;
	padding: 10px 20px;
}

nav#nav-mobile ul ul {
  display:none!important;
  margin:0;
  position: relative;
  border-bottom:none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
nav#nav-mobile ul ul li a {
  font-weight:600; 
  color:#333;
  letter-spacing:0;
  text-transform:none;
  background:#f5f5f5;
}

nav#nav-mobile ul li:hover > ul { display:block!important;}

/* drop menu hover */
nav#nav-mobile a:hover, nav#nav-mobile a:active {background:#666;color:#FFF;}










/* HOMEPAGE ///////////////////////////////////////////////////////////////////////////// */

.banner.home p {margin:0;padding:0;}

#features {
	text-align:center;
	padding:0 20px;
	font-size:.9em;
	line-height:normal;
	color:#fff;

}
.feature {
	padding:3% 4%;
	margin-bottom: -1000px;
    padding-bottom: 1000px;
	text-align:center;
}
.feature p {margin:0;}
.featureTitle {
	font-weight:700;
	font-size:1.8em;
	line-height:1.1em;
	text-transform:uppercase;
	margin:0;
	padding-bottom:10px;
}

.feature img {
	text-align:center;
	max-width:60px;
	margin:0 auto;
}
.feature p.button-rev {margin:20px 0;}



.services {text-align:center;}
.services h1 {font-size:2.5rem;}
div.service {text-align:center;}
.service img {margin:0 auto!important;max-width:150px;}
.service h2 {margin-top:0;font-size:1.3em;}
.service a {text-transform:uppercase;font-weight:600;font-size:0.85em;padding-left:5px;letter-spacing:0.05em;}



/* CONTENT /////////////////////////////////////////////////////////////////////////////// */

.header-phone a {font-size:1.9em;font-weight:600;color:#3ff;}
.header-phone a:hover, .header-phone a:active {color:#FFF;}
p.header-phone {margin:0;}


#content img {border-radius:30px;}

p.pageTitle {
	font-size:2.75rem;
	text-align:center;
	font-weight:700;
	letter-spacing: -.03em;
	margin-top:0;
}

.intro {
	font-size:1.6em;
	line-height:1.3em;
	font-weight:300;
	color:#999;
	text-align:center;
	max-width:80%;
	margin:0 auto 2em auto;
	padding:2% 0;
	border-bottom:2px solid #EEE;
	border-top:2px solid #EEE;
	display:block;
}
.intro img {margin:0 auto!important;}

.callout {
	padding:40px;
	border-radius:2em;
	border:1px solid #DDD;
	margin:50px 0 30px 0;
	background:#f8f8f8;
	clear:both;
}
.callout h1,.callout2 h1,
.callout h2,.callout2 h2,
.callout h3,.callout2 h3,
.callout h4,.callout2 h4,
.callout h5,.callout2 h5,
.callout h6,.callout2 h6 {margin:0;}

.callout2 {
	padding:40px 40px 20px 40px;
	border-radius:1.5em;
	margin:50px 0;
	background:#f8f8f8;
	clear:both;
}

.bio img {max-width:450px;}

.featureimage {padding:20px;border-radius:100%;}

.highlight {
	font-size:1.6em;
	line-height:1.3em;
	font-weight:300;
	color:#666;
	text-align:center;
	max-width:80%;
	margin:0 auto 2em auto;
	padding:2% 0;
	display:block;
}

.bookcover {
	max-width:33%;
	float:left;
	padding:0 20px 15px 0;
	margin:0;
}
.bookcover img {border:1px solid #DDD;	max-height:250px;width:auto;border-radius:0px!important;}
.bookcover a:hover img {box-shadow: 0px 4px 10px #CCC;}


.photocircle img {border-radius:50%!important;border:5px solid #fff;}

#steps ul {padding-bottom:0;}
.numeral {
	font-size:4.5em;
	font-weight:700;
	text-align:center;
	color:rgba(201,209,9);
}
#steps .col {padding:0!important;}


div#whyspark {
	padding:5% 0 5% 50%;
	background-image: url(images/shout.png);
    background-repeat: no-repeat;
    background-position: 0 100%;
	background-size: 50% auto;
}

div#whyspark h1 {text-align:left;}





/* Accordian ----------------- */
.accordion .col {padding:2%;}
.accordion {
    margin: 50px 0;

    /*
    -webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.05);
    -moz-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.05);
    box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.05);
    */
}

.accordion-toggle {
    padding:20px;
    cursor: pointer;
    clear: both;
    background-image: url(images/toggle.svg);
    background-size: 12px 40px;
    background-repeat: no-repeat;
    background-position: 98% 50%;
    margin-bottom: 2px;
    font-weight: 600;
    font-size: 1.1em;
    /*color:#0CC;*/
	border-top: 1px solid rgba(0,0,0,0.1);
}


.accordion-toggle:hover {
    background: rgba(255,255,255,0.8);
    background-image: url(images/toggle.svg);
    background-size: 12px 40px;
    background-repeat: no-repeat;
    background-position: 98% 50%;
    color: #555;
}

.accordion-content {
    display: none;
    padding: 30px; 
	margin-top:-2px;
}

.accordion-content.default {
    display: block;
}

.accordion-content-title {margin-top:0;font-weight:700;color:#444;line-height:1.3em;font-size:1.5em;}


.contact .col {padding: 10px;}


.button a {
  border-radius: 5px;
  border:2px solid rgba(0,0,0,0.2);
  margin:5px 0; 
  padding:5px 20px;
  background:transparent;
  color:#666;
  display:inline-block;
  text-transform:uppercase;
  font-size:0.95em;
  font-weight:600;
  line-height:28px;
  letter-spacing:0.05em;
}
.button a:hover,.button a:active {background:rgba(0,0,0,0.05);}

.button-rev a {
  border-radius: 5px;
  border:2px solid rgba(255,255,255,0.5);
  margin:5px 0; 
  padding:5px 20px;
  background:transparent;
  color:#fff;
  display:inline-block;
  text-transform:uppercase;
  font-size:0.95em;
  font-weight:600;
  line-height:28px;
  letter-spacing:0.05em;
}
.button-rev a:hover,.button-rev a:active {background:rgba(255,255,255,0.2);}



/* FOOTER /////////////////////////////////////////////////////////////// */

footer {
  padding:0;
  width:100%;
}

footer p {margin:1em 0;}
footer ul {padding:0;margin:0;list-style:none;}
footer li {display:inline;}
footer li a {display:inline-block;padding:10px;}
footer li a:hover {color:#FFF;}

div.social i {font-size:1.5em;}

.footerLogo img {max-width:150px;margin:10px auto;}


.copyright {padding:0 30px 20px 30px;text-align:center;font-size:.8em;clear:both;line-height:normal;}


a.back-to-top {
    font-size:1.6em;
    line-height: 33px;
    display: none;
    width:40px;
    height:40px;
	border-radius:50%;
    position: fixed;
    z-index: 9999;
    right: 20px;
    bottom: 20px;
    background: #0CC;
    color:#fff;
    text-align:center;
	padding:0;
}
a.back-to-top:hover { background: #6FF;color:#FFF;}






/* 404 Error //////////////////////////////////////////////////////////////////// */
.error-404 {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    line-height:normal;
    background:#fff;
}
.error-404 p {margin-bottom:20px;}

.outer {
  display: table;
  width: 100%;
  height: 100%;
    padding:5% 5% 15% 5%;
}
.inner {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}
.centered {
  position: relative;
  display: inline-block;
}
.error404 {font-size:8em; font-weight:700;padding:20px 20px 0 20px;display:block;line-height:.85em;}
.errortitle {font-size:2.2em;text-transform:uppercase;color:#999;font-weight:600;}
.errormessage {font-size:1.2em;}






/* WORDPRESS
=========================================================================================================== */

.widgetTitle {display:none;}



/* WP image alignment fix */
img.alignright {float:right; margin:0;}
img.alignleft {float:left; margin:0;}
img.aligncenter {display: block; margin:0;}
.alignright {float:right;margin:0;}
.alignleft {float:left;margin:0;}
.aligncenter {display: block; margin:20;}
.alignnone {margin:0;}

.wp-caption img,.wp-caption .wp-caption-text { width: 100%;max-width: 100%;}
.wp-caption {width:90%!important;}

.wp-caption-text {font-size:.8em;line-height:1.4em;color:#777;font-style:italic;text-align:center;margin:10px 0;padding:0;}

/* numerical pagination ------------------------------------------------------ */
.pagenav ul {padding:0;font-weight:600;font-size:.8em;}
.pagenav li {display: inline;}
.pagenav li a,
.pagenav li a:hover,
.pagenav li.active a,
.pagenav li.disabled {
  border-radius: 3px;
  cursor: pointer;
  padding: 5px 10px 5px 10px;
  color: #777;
  text-decoration:none;
  border:1px solid #DDD;
  font-weight:500;
}
.pagenav li a:hover,
.pagenav li.active a {background-color: #EEE;color:#666;}


/* Search */
#searchform {clear:both;x-system-font:none;font-size:14px;position:relative;overflow:hidden;font-variant:normal;font-weight:normal;line-height:normal;width:100%;}
#s {border:1px solid #555;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;padding:5px 10px;width:100%;background:transparent;color:#FFF;}
#searchsubmit {position:absolute;right:0px;top:0px;background:url(images/icon_search.png) no-repeat scroll 0 0;background-position: center center;border:none;height:40px;width:40px;text-indent:-9999px;margin:0;padding:0px;cursor:pointer;}
#searchsubmit:hover {background:url(images/icon_search_rev.png) no-repeat scroll 0 0;background-position: center center;}
.screen-reader-text {display:none;}


/* Posts (news) */
.meta {color: #AAA;font-size:.8em;padding:10px 0;}

.postHeadline {font-size: 1.5em;line-height:1.2em;font-weight:normal;padding:0;margin:0;}
.postTitle {font-size: 2.3em;line-height:1.2em;font-weight:normal;clear:both;letter-spacing:-.02em; padding-top:30px;}

.post { display:block;clear:both;}
.entry {
  margin:0 20%;
  line-height:1.5em;
}
/*.excerpt {font-size:.9em;}*/

.entry-title {
  margin:0;padding:0;
  font-weight: 400;
  font-size:1.5em;
}

.attachment-post-thumb, .has-post-thumbnail img {float:left; padding: 0; margin:0 40px 10px 0;border-radius:15px;max-width:180px;}

.main .tags a {
  font-size: 0.7em;
  font-weight:500;
  text-transform:uppercase;
  line-height: normal;
  margin-right: 2px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border:1px solid #efefef;
  display: inline-block;
  padding: 3px 6px;
  color: #999;
  background:#efefef;
}
.tags a:hover {background:transparent;}
.posttags p {font-size:.85em;padding-top:20px;font-style:italic;}


.read-more {line-height:normal;font-size:.95em;font-weight:600;}
.nextarticle {margin-bottom:10px;}
.nextprev {font-size:.9em;line-height:1.5em;padding:0;}
.nextprev div {margin:10px 0 15px 0;}



.newsHeadlines p {padding:0;margin:0 0 10px 0;line-height:normal;}
.newsHeadlines .excerpt {padding-bottom:20px;border-bottom:1px solid #EEE;}
.headlineTitle {font-size:1.3em;}

.post_featuredimage img {margin:0 auto 40px auto!important;}
div.entry img {padding:30px;}





form {margin:0!important;}




.contactForm form {padding:10px 20px 20px 20px;background:#f8f8f8;}
.wpforms-container input[type="text"] {width:100%!important}


/* Media Queries /////////////////////////////////////////////////////////////////////////// */

@media all and (max-width: 1320px) {

    #nav-trigger,
    nav#nav-mobile {display: block; }
    nav#nav-main  {display: none; }
	.topbar {display:none;}

    body {font-size:.95em;line-height:normal;}

  .intro {font-size:1.4em;line-height:1.2em;padding:0 3% 3% 3%;}

    footer {text-align:center!important;}
}

 @media only screen and (max-width: 768px) {
	 
	 .large {font-size: 125%;;}
	 
	.half {width:100%;}

	 .logo img {max-width:150px;}
	 
	 #banner {min-height:90px;}
	  p.bannerTitle {font-size:2em;}
	 
	 section {padding:2% 0 4% 0;}
	 
	 .sectionTitle, .pageTitle {font-size:1.5em;}
	 .intro {font-size:1.2em;padding:20px 0;}
	 .feature {padding:0;font-size:.85em;}
	 .featureTitle {font-size:1.5em;}
	 .feature p {margin-bottom:0;}
	 
	 .bio img {max-width:100%;margin:50px 0 20px 0;}
	 .bio.first img {margin-top:0;}
	 
	 .post { padding-right:0;}
	 
    div#whyspark {
		padding:0 20px;
		background-image: none;
	}
	 div#whyspark h1 {text-align:center;}
	 
	 
	 
}

 @media only screen and (max-width: 480px) {
	 
#content .col {padding:0 3%!important;}
	 
h1,h2,h3,h4,h5,h6 {text-align:center;}
	 
.pad5 {padding:0 2%;}
.pad10 {padding:0 2%;}
.pad20 {padding:0 2%;}
	 
	 .homebanner p {display:none;}
	 .services h1 {font-size:1.4em;}
	 
  #features, #features .container {padding:0;}
  .feature {
	padding:3% 4%;
	margin-bottom: 0;
	  width:50%;display:inline;
	  min-height:175px;
}
	 .feature p {margin:5px 0 0 0;}
	 .feature img {display:none;}
	 .featureTitle {padding-bottom:0;}
	 p.featureContent {display:none;}

	 .service img {max-width:100px;}
	 
	 .pageTitle {margin-top:5%;}	
	 .intro {max-width:90%;}
	.entry {margin:3% 2%;}
	 
.highlight {
	font-size:1.3em;
	line-height:1.2em;
	max-width:90%;
	margin:0 auto 1.5em auto;
	padding:2% 0;
}
	 
	 #content img {border-radius:15px;}