/*
Theme Name: Canopy Trust
Author: Hodgeman Web Design
Author URI: https://hodgeman.co.nz/
Description: A bespoke responsive theme for the Canopy Conservation Trust, completed in June 2016 and soft launched on July 1st 2016. Featuring a fully responsive design using Bootstrap v3.3.6, custom post types for loading of supporters, sponsors & partners. Isotope grid display of supporters, MailChimp newsletter integration and website tracking via Google Analytics.
Version: 1.5
Tags: Grey, Green, Nature, Outdoors, Responsive, Bootstrap

Dk GREY: 	#333333
Lt GREY:	#727272
LIME:			#96bc33
GREEN:		#75961f
CREAM: 		#f5f4f2
*/


/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

.btn{border:none;border-radius:0}

body {
  background-color:#333;
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	color: #CCC;
}

a{color:#75961f;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;}
a:hover,
a:active,
a:visited{color:#96bc33}


.btn,
a.btn,
.navbar-toggle {
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  font-weight: bold;
}
a.btn:hover,
a.btn:active,
a.btn:visited{color:#FFF}


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

h1{font-size:1.8em;color:#333;margin-bottom:30px;margin-top:20px}
.home h1{margin-top:0}
h2{font-size:1.6em;color:#75961f}
h3{font-size:1.4em;color:#333}
h3{font-size:1.2em}

h3.widgettitle{color:#75961f}
hr{border-color:#999}
.wpb_wrapper hr{margin-bottom:55px}

.sticky-wrapper{height:60px;background-color:#333333}
#header{
	background:#333333;
	position:relative;
	height:auto;
	box-shadow:none;
	z-index:10;
	}
#header.stuck{
	position:fixed;
	width:100%;
	height:70px;
	z-index:100;
	box-shadow: 0 2px 5px RGBA(0,0,0,0.3);
	}
#logo>img{position:absolute;left:0;z-index:10}

#menu-bar{background-color:#333333}

.nav>li>a{padding:10px 10px;color:#FFF}
.nav-pills>li>a,
.navbar-nav>li>a{color:#FFF;font-family:'MuseoSlab500', sans-serif;font-weight:700}
.nav-pills>li>a{border-radius:0}

.nav-pills>li>a:hover{
	color:#FFF;
	background:#75961f;
}
.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover,
.nav-pills>li.current-menu-item>a,
.nav-pills>li.current-menu-parent>a{
	color:#333;
	background: #f5f4f2;
}

.navbar-nav>li>a:hover,
.navbar-nav>li>a:active,
.navbar-nav>li>a:focus,
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover{background-color:#75961f;color:#FFF;}
.navbar-nav>li.current-menu-item>a,
.navbar-nav>li.current-menu-parent>a,
.single-supporters #menu-item-230>a{background-color:#f5f4f2;color:#333}


.nav>li>a:focus,
.dropdown-menu>.active>a,
.dropdown-menu>.active>a:focus,
.dropdown-menu>.active>a:hover{background-color:#96bc33}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover,
.nav>li>a:hover{background-color:#75961f;}

.dropdown-menu{background-color:#75961f;margin:0;border-radius:0;text-align:right}
.dropdown-menu>li>a{color:#FFF;padding-right:15px}
.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus{background-color:#333;color:#FFF}

.dropdown-submenu{position:relative;}
.dropdown-submenu>.dropdown-menu{top:0;left:100%;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;}
.dropdown-submenu:active>.dropdown-menu, .dropdown-submenu:hover>.dropdown-menu {display: block;}
.dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#cccccc;margin-top:5px;margin-right:-10px;}
.dropdown-submenu:active>a:after{border-left-color:#ffffff;}
.dropdown-submenu.pull-left{float:none;}
.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;margin-left:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px;}

.navbar-nav .open .dropdown-menu .dropdown-header,
.navbar-nav .open .dropdown-menu>li>a {
	padding: 5px 25px;
}


.navbar-toggle {
  display: inline-block;
  padding: 12px;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
  border: none;
  cursor: pointer;
  user-select: none;
  background-color: #FFF;
}
.navbar-toggle .lines {
  display: inline-block;
  width: 21px;
  height: 3px;
  background: #FFF;
  transition: 0.5s;
  position: relative;
  vertical-align: middle;
}
.navbar-toggle .lines:before,
.navbar-toggle .lines:after {
  display: inline-block;
  width: 21px;
  height: 3px;
  background: #FFF;
  transition: 0.5s;
  position: absolute;
  left: 0;
  content: '';
}
.navbar-toggle .lines:before{
  -webkit-transform: rotate3d(0, 0, 1, 45deg);
  -moz-transform: rotate3d(0, 0, 1, 45deg);
  -ms-transform: rotate3d(0, 0, 1, 45deg);
  -o-transform: rotate3d(0, 0, 1, 45deg);
  transform: rotate3d(0, 0, 1, 45deg);
}
.navbar-toggle .lines:after{
  -webkit-transform: rotate3d(0, 0, 1, -45deg);
  -moz-transform: rotate3d(0, 0, 1, -45deg);
  -ms-transform: rotate3d(0, 0, 1, -45deg);
  -o-transform: rotate3d(0, 0, 1, -45deg);
  transform: rotate3d(0, 0, 1, -45deg);	
}
.navbar-toggle.collapsed .lines:before {
  top: 6px;
}
.navbar-toggle.collapsed .lines:after {
  top: -6px;
}
.navbar-toggle.collapsed:hover {
  opacity: 1;
}
.navbar-toggle.collapsed:hover .lines:before {
  top: 7px;
}
.navbar-toggle.collapsed:hover .lines:after {
  top: -7px;
}
.navbar-toggle:active {
  -webkit-transition-duration: 0;
  -moz-transition-duration: 0;
  transition-duration: 0;
  background: rgba(0, 0, 0, 0.1);
}
.navbar-toggle .lines {
  background: transparent;
}
.navbar-toggle .lines:before, .navbar-toggle .lines:after {
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  top: 0;
  width: 21px;
}
.navbar-toggle.collapsed .lines {
  background: #FFF;
}
.navbar-toggle.collapsed .lines:before{
  -webkit-transform: rotate3d(0, 0, 1, 0deg);
  -moz-transform: rotate3d(0, 0, 1, 0deg);
  -ms-transform: rotate3d(0, 0, 1, 0deg);
  -o-transform: rotate3d(0, 0, 1, 0deg);
  transform: rotate3d(0, 0, 1, 0deg);
}
.navbar-toggle.collapsed .lines:after{
  -webkit-transform: rotate3d(0, 0, 1, 0deg);
  -moz-transform: rotate3d(0, 0, 1, 0deg);
  -ms-transform: rotate3d(0, 0, 1, 0deg);
  -o-transform: rotate3d(0, 0, 1, 0deg);
  transform: rotate3d(0, 0, 1, 0deg);	
}

#content{background-color:#f5f4f2;color:#333}
	#content .container{padding:0 15px 30px}
	.home #content .container{padding:30px 15px 0px}
	.home .carousel{margin-bottom:0}

.white-box {margin-bottom:30px}	
	.white-box .wpb_wrapper{background-color:#FFF}
	.white-box h2{background-color:#4d4d4d}
	.white-box h2 a{display:block;padding:10px 0 10px 15px;color:#FFF}
	.white-box h2 a:hover{color:#FFF;text-decoration:none}
	.white-box .wpb_content_element{margin-bottom:0}
	.white-box .wpb_text_column:nth-child(2){padding:15px}
	.white-box .wpb_wrapper>.padding>.wpb_wrapper{padding:15px}

.grid-item{margin-bottom:30px;height:400px}
.grid-item:hover{background-color:#FDFDFD}
ul.latest-posts{list-style:none;padding-left:0}
ul.latest-posts li{border-bottom:1px solid #DDD;margin-bottom:10px;padding-bottom:10px}
ul.latest-posts li:last-child,
ul.latest-posts li.last-child{border-bottom:none}

.pager li>a,
.pager li>span{border-radius:4px}

.pager li>a,
.btn-primary,
.navbar-toggle{background-color:#5b6e0e;border-color:#5b6e0e;color:#FFF}

.pager li>a:focus,
.pager li>a:hover,
.btn-primary:focus,
.btn-primary:hover,
.navbar-toggle:hover{background-color:#93a924;border-color:#93a924;color:#FFF}

#searchform{margin-top:25px;margin-bottom:15px}
#header.stuck #searchform{margin-top:20px}

#breadcrumbs{padding:20px 0;}

.carousel{margin-bottom:15px}
.carousel-control.left,
.carousel-control.right{background-image:none}

.carousel-caption{bottom:0;right:0;left:auto;background:RGBA(0,0,0,0.5);padding:5px 10px;font-size:0.9em}
.carousel-inner>.item>a>img,
.carousel-inner>.item>img{min-width:100%}

#masthead{height:300px;background-position:50% 50%;background-size:cover;position:relative}
	#masthead .caption{position:absolute;background:RGBA(0,0,0,0.5);color:#FFF;bottom:0;right:0;padding:5px 10px;font-size:0.9em}

.vc_custom_heading{margin-bottom:30px}

.make-responsive {
  position: relative;
  padding-top: 25px;
  padding-bottom: 67.5%;
  height: 0;
  margin-bottom: 16px;
  overflow: hidden;
}

.make-responsive.widescreen { padding-bottom: 57.25%; }
.make-responsive.vimeo { padding-top: 0; }

.make-responsive iframe,
.make-responsive object,
.make-responsive embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px), only screen and (max-width: 767px) {
  .make-responsive { padding-top: 0; }
}

img.pull-left{margin:0 20px 20px 0}
img.pull-right{margin:0 0 20px 20px}

blockquote {
	color:#A9890A;
  border-left: 10px solid #A9890A;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
  color: #A9890A;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  vertical-align: -0.4em;
}
blockquote p {
  display: inline;
}

#newsletter{background-color:#96bc33;padding:30px 0;color:#FFF}
	#newsletter .btn-primary{background-color:#333}


#footer{color:#EEE;background:#333;padding:30px 0;}
	#footer a,
	#footer a:hover{color:#FFF}
	#footer h3.widgettitle{color:#96bc33;margin-bottom:5px;text-transform:uppercase;font-size:1.2em;font-family:"Trebuchet MS", Arial, Helvetica, sans-serif}
	#footer .btn-primary{background-color:transparent}
	#menu-footer-menu{list-style:none;padding-left:0}
	#footer ul{list-style:none;padding-left:0;font-size:0.9em}
	#footer hr{border-color:#666}
	
	#b2top{position:fixed;bottom:20px;right:20px;color:#333;background-color:#75961f;padding-top:8px;width:60px;height:60px;display:none;text-align:center}
	#b2top:hover{padding-top:5px}
	#b2top:hover,#b2top:active,#b2top:focus{background-color:#96bc33}

#credit{font-size:0.8em}
	#credit p{margin-bottom:5px}
	#credit a{color:#EEE}

a[href$=".pdf"]:before {padding:0 0 0 25px;content:"";background:url(images/pdf.png) bottom left no-repeat}


.wpb_row{margin-bottom:0}

.vc_btn3.vc_btn3-size-sm.vc_btn3-style-outline{font-size:1em}
.vc_btn3.vc_btn3-size-md.vc_btn3-style-outline {
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 35px;
	padding-right: 35px;
	font-size: 1.6em;
}


.vc_btn3-size-sm{font-size:1.2em}

.bg_center{background-position: 50% 50% !important}

#offer .wpb_text_column{margin-bottom:10px}

.parallax{background:linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) );
	height:auto;background-size:cover;background-position:50%;margin-bottom:30px}
.parallax h1{margin:20px 0;color:#FFF;font-size:2em;line-height:2em;text-align:center}
.parallax .container-fluid{background:url(images/bg_pattern.png);height:auto;}

.alignleft{float:left;margin:0 20px 30px 0}
.alignright{float:right;margin:0 0 30px 20px}
.wp-caption-text{font-size:0.9em;font-style:italic;padding:10px;background-color:#666;color:#fff}

img.aligncenter{display:block;margin:0 auto}
.text-center img.img-responsive{display:block;margin:0 auto}


ul.nobullet{list-style:none;padding-left:0}
ul.nobullet>li{margin-bottom:15px}

a.btn-ghost, .btn-ghost {
	background: none;
	border: 1px solid #076a2c;
	color: #fff !important;
	padding: 8px 20px;
	vertical-align: middle;
}
a.btn-ghost:hover, .btn-ghost:hover {
  background: #75961f;
  border: 1px solid #75961f;
  color: #fff;
}

#tiles{margin-top:30px}
#tiles>div{margin-bottom:15px}
#tiles .has-post-thumbnail>a:hover>img{opacity:0.7}

#slideshow{margin-top:30px}

#carousel-markers .carousel-thumbnail {
	margin: 0 0 15px;
}
#carousel-markers .carousel-thumbnail{opacity:0.5}
#carousel-markers .carousel-thumbnail:hover{opacity:0.8}
#carousel-markers .carousel-thumbnail.active{opacity:1}

.sponsors h2, .partners h2{color:#333;text-align:right}
.sponsors h2{margin-top:10px}
.partners h2{margin-top:25px}

.supporter{margin-bottom:30px}

.home .supporters_sponsors img{
	-webkit-filter: grayscale(100%);
	filter: gray;
	filter: grayscale(100%);
	filter: url(desaturate.svg#greyscale);
}


/* BLOG POSTS */

.post{margin-bottom:30px}
#sidebar{padding-top:30px}
.widget{margin-bottom:30px}


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px) {
	h1{font-size:2.2em}
	h2{font-size:1.8em}
	h3{font-size:1.6em}
	h3{font-size:1.4em}
	h1,h2,h3,h4,h5,h6{margin-top:0}
	#logo{margin:10px 0}
	.parallax{height:180px;margin-bottom:0}
	.parallax h1{font-size:3.6em;line-height:180px;margin:0}
	.parallax .container-fluid{height:180px;}
	.navbar-right {margin-right:0}
	#mainnav{margin-top:30px}
	#searchform{margin-bottom:0}
	#tiles{margin-top:0}
	.dropdown-menu{text-align:left}
	.navbar-nav .open .dropdown-menu .dropdown-header,
	.navbar-nav .open .dropdown-menu>li>a {
		padding: 5px 15px;
	}
	#masthead{height:400px}
}

@media (min-width: 992px) {
	h1{font-size:2.4em}
	h2{font-size:2em}
	h3{font-size:1.8em}
	h3{font-size:1.6em}
	#logo{margin:15px 0}
	.parallax{height:280px}
	.parallax h1{font-size:4.4em;line-height:280px}
	.parallax .container-fluid{height:280px;}
	.vc_btn3.vc_btn3-style-outline, .vc_btn3.vc_btn3-style-outline:hover, .vc_btn3.vc_btn3-style-outline:focus {border-width:3px}
	ul#headlinks{margin-top:8px}
	#googlemap{height:350px}
	.nav>li>a{padding:10px 15px}
	#mainnav{margin-top:40px}
	#header.stuck #mainnav{margin-top:29px}
	#masthead{height:500px}
}

@media (min-width: 1200px){
	h1{font-size:2.6em}
	h2{font-size:2.2em}
	h3{font-size:2em}
	h3{font-size:1.8em}
	#logo{margin:30px 0}
	.parallax{height:300px}
	.parallax h1{font-size:5em;line-height:300px}
	.parallax .container-fluid{height:300px;}
	ul#headlinks{margin:20px 0px 17px}
	#googlemap{height:400px}
	#mainnav{margin-top:40px}
	#masthead{height:600px}
}
@media (min-width: 1300px){
	.container { width: 1276px; }
}
