/*
Theme Name: American Customs & Classics
Theme URI: http://www.acac.co.nz
Author: Hodgeman Web Design
Author URI: https://hodgeman.co.nz/
Description: A bespoke responsive theme for American Customs & Classics, completed in Feb/Mar 2018.
Version: 1.0.0
Tags: Grey, Responsive, Bootstrap

RED: #EC1C24
*/

/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */

@import url('https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:700');

html, body, div, span, applet, object, iframe,
p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 100%;
   font: inherit;
}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
   display: block;
}

body {
   line-height: 1;
}

blockquote, q {
   quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
   content: '';
   content: none;
}

table {
   border-collapse: collapse;
   border-spacing: 0;
}

/* --------------------------------------------
   General Rules
-----------------------------------------------*/

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  -webkit-font-smoothing: antialiased;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
   display: block;
}


/* 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;
line-height:130%;
font-size:90%;
}

a{color:#EC1C24;
	-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:#B90E15}

small{font-size:80%}
strong{font-weight:bold}

.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}

p{margin-bottom:20px}
h1,h2,h3,h4,h5,h6{font-weight:800;font-family:'Yanone Kaffeesatz', sans-serif;margin-bottom:20px;text-transform: uppercase}

h1{font-size:3em;color:#333;margin-bottom:30px;text-align: right}
h2{font-size:1.8em;color:#333}
h3{font-size:1.6em;color:#666}

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

.sticky-wrapper{background:RGBA(50,50,50,0.8)}
#header{
	background:RGBA(50,50,50,0.8);
	position:relative;
	width:100%;
	height:auto;
	box-shadow:none;
	z-index:100;
	-webkit-transition: all 1s; /* Safari */
    transition: all 1s;
	}
#header.stuck{
	position:fixed;
	box-shadow: 0 2px 5px RGBA(0,0,0,0.3);
	top:0px;
	}
#header #logo{position: absolute;z-index:1}

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

.nav-pills{display:inline-block}
.nav-pills>li>a,
.navbar-nav>li>a{color:#EEE}
.nav-pills>li>a{border-radius:0;font-size:20px}
.nav-pills>li+li {margin-left:5px}

.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover{background-color:transparent}

.nav-pills>li.active>a span.front,
.nav-pills>li.active>a:focus span.front,
.nav-pills>li.active>a:hover span.front,
.nav-pills>li.current-menu-item>a span.front,
.nav-pills>li.current-menu-parent>a span.front,
.projects-template-default .nav-pills>li#menu-item-35>a span.front{
	color:#000;
	background-color:#EC1C24;
}

.navbar-nav>li>a:hover span.front,
.navbar-nav>li>a:active span.front,
.navbar-nav>li>a:focus span.front,
.nav .open>a span.front,
.nav .open>a:focus span.front,
.nav .open>a:hover span.front{background-color:transparent;color:#FFF;}
.navbar-nav>li.current-menu-item>a span.front,
.navbar-nav>li.current-menu-parent>a span.front{background-color:transparent;color:#FFF}


.nav>li>a:focus,
.dropdown-menu>.active>a,
.dropdown-menu>.active>a:focus,
.dropdown-menu>.active>a:hover{background-color:transparent}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover,
.nav>li>a:hover{background-color:transparent;color:#FFF}

.dropdown-menu{background-color:#333;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;
}

.block-menu {margin:5px 0}
.block-menu li {
	display: inline-block;
}

.block-menu li a {
	color: #fff;
	display: block;
	text-decoration: none;
	font-smoothing: antialiased;
	text-transform: uppercase;
	overflow: visible;
	line-height: 20px;
	font-size: 24px;
	padding: 15px 10px;
	font-family:'Yanone Kaffeesatz', sans-serif;
}

/* animation domination */
.three-d {
	perspective: 200px;
	transition: all .07s linear;
	position: relative;
	cursor: pointer;
}
	/* complete the animation! */
	.three-d:hover .three-d-box, 
	.three-d:focus .three-d-box {
		transform: translateZ(-25px) rotateX(90deg);
	}

.three-d-box {
	transition: all .3s ease-out;
	transform: translatez(-25px);
	transform-style: preserve-3d;
	pointer-events: none;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
}

/* 
	put the "front" and "back" elements into place with CSS transforms, 
	specifically translation and translatez
*/
.front {
	transform: rotatex(0deg) translatez(25px);
}

.back {
	transform: rotatex(-90deg) translatez(25px);
}

.front, .back {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: black;
	padding: 15px 10px;
	color: white;
	pointer-events: none;
	box-sizing: border-box;
}
.back{color: #000;background-color: #EC1C24;}



.navbar-toggle {
	margin-top: 15px;
	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-fluid{padding:0px 15px}
	.home #content .container-fluid{padding:30px 15px 0px}
.page-id-8 #content{background:#f5f4f2 url(images/acac_workshop_bg.jpg) 50%/cover no-repeat} /*CONTACT PAGE*/
	
.headers .carousel-inner>.item{background-size:cover;background-position:center bottom;background-repeat:no-repeat;}	
.headers .carousel-caption{top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 60%;
	height: 15%;
	margin: auto;
	padding:0;
}
.headers .carousel-caption h3{font-size:4em;color:#FFF}
.headers .carousel-caption p{font-size:1.5em}


.white-box {margin-bottom:30px}	
	.white-box .wpb_wrapper{background-color:#FFF}
	.white-box h2{background-color:#4d4d4d;color:#FFF;padding:10px 0 10px 15px}
	.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}

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:#333;border-color:#333;color:#FFF}

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

#searchform{margin-top:15px;margin-bottom:15px}

#breadcrumbs{padding:20px 0;}

.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; }
}

#filters{margin-bottom:30px}
#filters a{color:#505050}
#filters a:hover,
#filters a:focus{text-decoration:none}
#filters a.active{border-bottom:2px solid #505050;color:#000;}
#filters a:hover{color:#666;border-bottom:2px solid #666;}

article.projects{overflow:hidden}
figcaption>a h5{text-decoration:none;}

.projects, #content .wpb_text_column .projects:last-child{ margin-bottom: 30px}
.projects figure {position: relative;}

.overlay {
  position: absolute;
  top: 0;
  display: block;
  overflow: hidden;
  padding: 0;
  height: 100%;
  width: 100%;
  border-bottom: none;
  background-color: #333;
  text-align: center;
  opacity: 0;
  filter: alpha(opacity=0);
  cursor: pointer;
  -moz-opacity: 0;
}

.overlay,
.overlay-content {
  -webkit-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
  -moz-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
  -o-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
  transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    width: 100%;
    height: 100%;
}

.overlay h5 {
  margin-top: 0;
  padding-bottom: 0;
	font-size:1.2em;
	font-family: 'Gotham', sans-serif;
  color: #fff;
}
.overlay:hover{text-decoration:none}

.overlay:hover .overlay-content h5 {
  -webkit-animation: overlay .5s ease forwards;
  -moz-animation: overlay .5s ease forwards;
  animation: overlay .5s ease forwards;
}

@-webkit-keyframes overlay {
  from {
    -webkit-transform: translateY(0.5em);
  }
}

@-moz-keyframes overlay {
  from {
    -moz-transform: translateY(-0.5em);
  }
}

@keyframes overlay {
  from {
    transform: translateY(-0.5em);
  }
}

.overlay:hover {
  opacity: 0.80;
  filter: alpha(opacity=80);
  -moz-opacity: 0.80;
}



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

blockquote {
	color:#333;
	border:none;
  margin: 30px 10px;
  padding: 0;
  quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
  color: #333;
  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:#FFF;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:#FFF;background-color:#666;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:#999}

#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}

.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: #333;
  border: 1px solid #333;
  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}

.single-post .carousel-inner>.item>a>img,
.single-post .carousel-inner>.item>img,
.single-projects .carousel-inner>.item>a>img,
.single-projects .carousel-inner>.item>img{
	display:inherit;
	margin:0 auto;
}


.carousel-control.left,
.carousel-control.right{background-image:none}

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

.sponsors h2, .partners h2{color:#333;text-align:right}
.sponsors h2{margin-top:10px}
.partners h2{margin-top:25px}
.supporters_sponsors img{
	-webkit-filter: grayscale(100%);
	filter: gray;
	filter: grayscale(100%);
	filter: url(desaturate.svg#greyscale);
}


/* BLOG POSTS */

.post{margin-bottom:30px}
.post.has-post-thumbnail h3{margin-top:10px}
#sidebar{padding-top:30px}
.widget{margin-bottom:30px}
#footer .widget{margin-bottom:0px}

.post .press-item{display:block;width:100%;height:300px;background-position:top;background-size:cover;background-repeat:no-repeat}

.home #header.stuck{background:none;box-shadow:none}
.swiper-container {
    width: 100%;
    height: 100%;
	overflow: hidden;
}
.swiper-tile{width: 100%;height: 100%;background-position:50% 50%;background-size:cover;position:relative}
.slider-title{color:#FFF}
.slider-title>span{font-size:0.8em;margin-right:20px}
.swiper-caption{position:absolute;bottom:0;left:0;right:0;padding-top:100px;background: linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.65) 100%);height: 200px;width:100%;color:#EEE}
.swiper-caption h3{color:#FFF}
.swiper-caption h4.slider-caption{font-style:italic}

h3.author{margin-bottom: 0}
.testimonial .box{background-color: #FFF;padding:20px 20px 1px;font-style:oblique}
.testimonial .arrow {
    margin: 0 0 5px 20px;
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #FFF;
}

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

@media (min-width: 768px) {
	h1{font-size:3em;text-align:center}
	h2{font-size:1.8em}
	h3{font-size:1.6em}
	h3{font-size:1.4em}
	h1,h2,h3,h4,h5,h6{margin-top: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}
	#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;
	}
	.single-post .carousel-inner>.item>img,
	.single-projects .carousel-inner>.item>img{max-height:400px}
	#content .container-fluid{padding:30px 15px}
	.slider-caption{text-align:right}
}

@media (min-width: 992px) {
	h1{font-size:4em}
	h2{font-size:2em}
	.home h2{font-size:1.8em}
	h3{font-size:1.8em}
	h3{font-size:1.6em}
	.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}
	#mainnav{margin-top:29px}
	#masthead{height:500px}
	.single-post .carousel-inner>.item>img,
	.single-projects .carousel-inner>.item>img{max-height:450px}
}

@media (min-width: 1200px){
	h1{font-size:5em}
	h2{font-size:2.2em}
	h3{font-size:2em}
	h4{font-size:1.8em}
	#googlemap{height:400px}
	.single-post .carousel-inner>.item>img,
	.single-projects .carousel-inner>.item>img{max-height:450px}
}

@media (min-width: 1400px){
	.single-post .carousel-inner>.item>img,
	.single-projects .carousel-inner>.item>img{max-height:700px}
}