/*
Theme Name: PKD
Author: Peter King Design
Author URI: http://peterkingdesign.com/
Description: A custom designed, semantic, HTML5, canvas developed by Peter King Design.

*/

/* =COLORS
-------------------------------------------------------------- 

Red	E53916




*/

/* =Global Typography
-------------------------------------------------------------- */

body {	
	font-family: 'Open Sans', sans-serif;
	font-size: 100%;
	line-height: 1.7;
	color: #555;
	}

h1, h2, h3, h4, h5, h6,
#mainnav, .menu-footer-container li, #side-menu, .slideshow-title, #page-menu a, .typography .menu-solutions-container,
::-webkit-input-placeholder,
::-moz-placeholder, /* firefox 19+ */
:-ms-input-placeholder, /* ie */
input:-moz-placeholder
    {
	font-family: 'Open Sans', sans-serif;
	font-weight: normal;
	color:#777;
	}

input, textarea  {
	font-family: 'Open Sans', sans-serif;
}
	
/* Contact Form */
::-webkit-input-placeholder { font-family: 'Open Sans', sans-serif; color: #CCC;}
::-moz-placeholder { font-family: 'Open Sans', sans-serif; color: #CCC; } /* firefox 19+ */
:-ms-input-placeholder { font-family: 'Open Sans', sans-serif; color: #CCC; } /* ie */
:-moz-placeholder { font-family: 'Open Sans', sans-serif; color: #CCC; }

::-moz-selection { color: #FFF; background: #E53916; } /* Code for FF */ 
::selection { color: #FFF; background: #E53916; }

/* =Structure
-------------------------------------------------------------- */

html, body { position:relative; padding:0; margin:0; display:block;}
div {  display:block; }

html { }

	
body {
	margin: 0;
	background:#FFF;
}

body.home { }


.show-wp-toolbar #branding { /*Hide WP Toolbar Plugin */
	margin-top: 32px;
	/*transition: margin-top 1s ;*/
}
html.hide-wp-toolbar.transition #branding {
	/*transition: margin-top 1s 1s;*/
}

.site-width {	/* SITE WIDTH */
	max-width: 1240px;
	margin: 0 auto;
	position:relative;
}
.site-width-full {	
	width: 96%;
	margin: 0  2%;
	position:relative;
}

.site-width.skinny {
	max-width: 800px; 
	width:  auto;
	margin: auto;
}

#page {
	display: block;
	height: 100%;
	position: relative;
	min-height: 100vh;
}


#main {
	display:block;
	position:relative;
	clear: both;
}

.home #main {  }

#primary {
	margin-top: 3em;
}
.home #primary, 
.post-type-archive-services  #primary  { width: 100%;} 

.page-template-full-width-page-php #primary,
.post-type-archive-portfolio #primary,
.tax-portfolio-category #primary {
	width: 100%;
}

#secondary {
	display: none;
	
}
.home #secondary { }

.post-type-archive-portfolio #secondary,
.tax-portfolio-category #secondary {
}

#content {

}
.home #content {
}

#main .widget-area {

}
#colophon {
	clear: both;
	display: block;
	width: 100%;
	position: relative;
	bottom:0;
	z-index: 90;
	height: 180px;
	margin-top:10px;
	
}


#main, #primary, .site-width, #content, #secondary { /* height: 100%; */ }


/* Increase the size of the content area for templates without sidebars */
.full-width #content,
.image-attachment #content,
.error404 #content {
	margin: 0;
}

/* Text meant only for screen readers */
.screen-reader-text,
.assistive-text {
	position: absolute !important;
	clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
}

/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1%;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1%;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.displace {
	position:absolute;
	left:-10000px;
	top:auto;
	width:1px;
	height:1px;
	overflow:hidden;
	}

a, a:link, a:visited { color: #E53916; }
a:hover, a:active  { color: #222;  }

a:hover,
.typography a:hover {
	-moz-transition: 	color .3s ease-in-out;
	-webkit-transition:	color .3s ease-in-out;
  -o-transition: 		color .3s ease-in-out;
	transition:  		color .3s ease-in-out;	
}



/*Down pointing*/
.triangle-down {
    width: 10%;
    height: 0;
    padding-left:50%;
    padding-top: 60%;
    /*overflow: hidden;*/
}
.triangle-down:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-left: -12px;
	margin-top: -12px;
	
	border-left: 12px solid transparent;
	border-right: 12px solid transparent;
	border-top: 12px solid #FFF;
}

/*Up pointing*/
.triangle-up {
    width: 10%;
    height: 0;
    padding-left:50%;
    padding-top: 20%;
    /*overflow: hidden;*/
}
.triangle-up:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    margin-left: -12px;
	margin-top: -12px;
	
	border-left: 12px solid transparent;
	border-right: 12px solid transparent;
	border-bottom: 12px solid #FFF;
}

.arrow-container {	
	width: 25px;
	height: auto;
	margin: 7px auto 0;
 }

.arrow {
  display: inline-block;
  width: 25px;
  height: 25px;
  border-top: 2px solid #AAAAAA;
  border-right: 2px solid #AAAAAA;
}

.arrow-up {
  transform: rotate(-45deg);
}
.arrow-right {
  transform: rotate(45deg);
}
.arrow-down {
  transform: rotate(135deg);
}
.arrow-left {
  transform: rotate(-135deg);
}





/* =Header
-------------------------------------------------------------- */



:root {
	--header-height: 100px;
}



#FixedHeaderSpacer, #branding, .main-logo { height: var(--header-height);  }

#FixedHeaderSpacer.header-fixed {  }



#branding {
	display: block;
	width: 100%;
	position: fixed;
	z-index: 100;
	top: 0;
	background: rgba(255,255,255,.9);
}


hgroup {
}
#site-title {
	padding: 0.6em 0;
    margin: 0;
}
#site-description {
	font-size: .9375em;
	font-weight: normal;
	margin: 0 0 0 8px;
	
	position:absolute;
	left: -400%;
}

#logo-container {
	float:left;
}

.main-logo {
	display:block;
	/*background:url(images/logo-PKD.png) no-repeat 0 50%;*/
	width: 406px;
	margin: 0 ;
	text-decoration: none;
	}

.main-logo .site-logo { 
	width: 100%;
    height: 100%;
    object-position: 50% 50%;
    object-fit: contain;
}
	
#phone {
	float: right;
	margin: 20px 0 0 0;
	color: #AAA;
	height: 45px;
}

#phone h2.header-title {
	margin: 0;
	padding:0;
	font-weight:normal;
	letter-spacing: 2px;
	font-size: 220%
}




/* =Sliders & Background
-------------------------------------------------------------- */
#banner  {	
	position: relative;
	z-index: 10;
	
}
.home #banner {
	display:block;
}

#banner img {
}
.home #banner img {
	}
	
.featured-banner {
	width: 100%;
	height: 300px;
	margin: 0;
	background: #EFEFEF;
}


/* =Home Page
-------------------------------------------------------------- */



.section-band .site-width { min-height: inherit;}

.section-band { width:100%; overflow: hidden; position: relative; z-index: 10; padding: 120px 0; box-sizing: border-box;}


.section-band.no-padding { padding:0; }

.section-featured-image {   }

.section-header {  }

.section-content { }

.center-section-content-wrapper, .vertically-align { 
	transform: translateY(-50%);
	top: 49%;
	left: 0;
    right: 0;
	position: absolute;
}


.section-band {padding: 11vh 0 12vh 0;}
.section-band.fat { padding: 18vh 0 20vh 0;}
.section-band.slim {  padding: 6vh 0 6vh 0; }

.section-band.reverse { background: #333; }

.typography h2.skinny-title { text-align: center; color: #FFF; font-weight: bold; text-transform: uppercase; }

.typography h2.skinny-title span { 
	padding: 5px 130px;
	position: relative;
	display: inline-block;
	margin-bottom: 10px; 
}

.typography h2.skinny-title span::after,
.typography h2.skinny-title span::before { 
	content: ''; 
	display: block;
	position: absolute;
	width: 100px;
	top: 19px;  
	}
.typography h2.skinny-title span::after {right: 0;}
.typography h2.skinny-title span::before {left: 0;}
 

#Section-Home-About {}

#Section-Home-Blog {}



/* =Slideshow 
-------------------------------------------------------------- */


.slideshow {
	width: 100%;
	position:relative;
	height: 500px;
}

.single-portfolio .slideshow {
}



/* Specify Swiper's Size: */
.slideshow .swiper-container, .slideshow .swiper-slide,  .slideshow .swiper-wrapper, .slideshow .swiper-image {
  width: 100%;
  height: 100%;
}

.slideshow  .swiper-pagination {
	position: absolute;
	z-index: 20;
	left: 0;
	right: 0;
	bottom: 10px;
	text-align: center;
}
.slideshow  .swiper-pagination-bullet {
	display: inline-block;
	width: 16px;
	height: 16px;
	background: #FFF;
	margin-right: 6px;
	opacity: 0.7;
	border: 0 solid #fff;
	cursor: pointer;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.slideshow .swiper-pagination-bullet {
  background: #E53916;
  opacity: .8;
}
.slideshow .swiper-pagination-bullet:hover,
.slideshow .swiper-pagination-bullet-active {
  background: #E53916;
  opacity: 1;
}

.swiper-button-prev, .swiper-button-next { 
	color:rgba(255,255,255,.7);
 }
 
 .swiper-button-prev:after, .swiper-button-next:after {
	 font-size: 3em; 
 }
 
 .slide-arrow { }
 
 #Arrow-left {}
 
 #Arrow-right {}


.slideshow .swiper-container, .slideshow .swiper-slide, .slideshow .swiper-wrapper { position:relative; }



.single-portfolio .slideshow  .pagination, .single-services .slideshow  .pagination, .page-child .slideshow  .pagination { bottom: 40px; }

.swiper-image { }

.slideshow-content {
	position:absolute; 
	display:block;
	left: 0; 
	right:0; 
	top: auto;
	bottom: 0;
	height: auto;
	width: auto; 
	background: rgba(0,0,0,.6); 
	color:#FFF;
	z-index: 110;
	padding: 1vw 0 0 3vw;
	}



.slideshow-content.right { right: 0; background-position: right top;}
.slideshow-content.left { left: 0; background-position: left top; }

.slideshow-title {
	color: #FFF; 
	font-size: 1.3em; 
	line-height:1.5; 
}
.slideshow-text {
	font-size: 1.1em;
	line-height: 1.7;
	letter-spacing: 1px;
}

.slideshow-text blockquote {
	margin: 0;
	text-indent: -10px;
	font-style: italic;
}	


/* =Menu
-------------------------------------------------------------- */
#mainnav #main-menu {display:block; }
#mainnav #responsive-menu {display:none; }

#mainnav {
	display: block;
	float: right;
	padding: 0;
	z-index: 200;
	position: relative;
	clear: right;
}

#mainnav ul {
	list-style: none;
	padding:0;
	margin:0;
	display:flex;
}
#mainnav li {
	position: relative;
	display:block;
}



#mainnav li a {
	display: block;
	font-size: 1em;
	text-transform: uppercase;
	text-decoration: none;
	color: #444;
	padding: 0 1em;
	margin: 0;
	letter-spacing: 1px;
	text-align: center;
	
	line-height: 80px;
	line-height: var(--header-height); 
}


#mainnav .sub-menu {
	display: none;
	position: absolute;
	z-index: 999;
	width:auto;
	border:none;
	min-width: 200px;
	border-top: solid 1px #EEE;
		
	/* -moz-box-shadow: 0 3px 4px rgba(0,0,0,.8); */
	/* -webkit-box-shadow: 0 3px 4px  rgba(0,0,0,.8); */
	/* box-shadow: 0 3px 4px  rgba(0,0,0,.8); */
}
#mainnav ul li:hover > ul.sub-menu {
	display: block;
}

#mainnav .sub-menu li {
	display: block;
	background: rgba(255,255,255,.8);
}	

#mainnav .sub-menu li a {
	border-bottom: 1px #FFFB solid;
	white-space: nowrap;
	padding: 1em;
	text-align: left;
	text-transform: capitalize;
	line-height: 1em;
	}
	

#mainnav li:hover {
	}
	
#mainnav li:hover > a ,
#mainnav .sub-menu :hover > a {
	color:#E53916;
}
#mainnav li:active > a ,
#mainnav .sub-menu :active > a {
}

#mainnav .sub-menu a:hover {
	background: #FFF;
}

#mainnav li:active  {
}

#mainnav li:active > a,
#mainnav .sub-menu :active > a {
	
}


#mainnav li.current-menu-item > a
#mainnav li.current-menu-parent  > a {
	color:#E53916;

}



/* HAMBURGER */
#hamburger-menu { display:block;}
#hamburger { 
	width: 2em;
	padding: 1.3em;
	position: fixed;
	cursor: pointer;
	display: none;
	z-index: 1000;
	right:0;
	font-size: 1em;
	background-color: #FFFc;
}

.not-home #hamburger { position: fixed; }

#hamburger .layer { 
	width: auto;
	height: 3px;
	background: #999;
	position: relative;
	margin-bottom: 0.4em;
 }
#hamburger #layer3 {margin-bottom: 0;}
#hamburger:hover .layer {  }


#hamburger-menu:hover #mainnav.js { display:block;  opacity:1; }
#hamburger-menu:hover + .entry-header.js  { display:none; }


#mainnav li.mobile-menu { display: none; }


#hamburger .layer { 
	-webkit-transition: 	transform 500ms ease-out, top 500ms ease-out, opacity 500ms ease-out, bottom 500ms ease-out;
    -moz-transition: 		transform 500ms ease-out, top 500ms ease-out, opacity 500ms ease-out, bottom 500ms ease-out;
    -o-transition: 			transform 500ms ease-out, top 500ms ease-out, opacity 500ms ease-out, bottom 500ms ease-out;
    transition: 			transform 500ms ease-out, top 500ms ease-out, opacity 500ms ease-out, bottom 500ms ease-out;
}

#layer1 { top:0; transform: rotate(0deg);}
#layer2 { opacity:1; transform: rotate(0deg);}
#layer3 { bottom:0; transform: rotate(0deg);}

#hamburger.active #layer1 { top: .63em; transform: rotate(135deg); }
#hamburger.active #layer2 { opacity: 0; transform: rotate(360deg);  }
#hamburger.active #layer3 { bottom: .63em; transform: rotate(-135deg); }


#mainnav #responsive-menu {
	display:none; 
	position: fixed ; 
	top:0; 
	bottom: 0; 
	left:105%; 
	width: 100%; 
	background:rgba(0,0,0,.9);
	overflow: auto;
	
	-webkit-transition: 	left .3s ease-out;
  	-moz-transition: 		left .3s ease-out;
  	-o-transition: 			left .3s ease-out;
  	transition: 			left .3s ease-out;
	}


/* =Top Menu
-------------------------------------------------------------- */
#TopNav {
	
}
#TopNav .menu-top-menu-container {
}

#TopNav .menu {
    list-style: none outside none;
    padding: 0;
	margin: 0;
	
}
#TopNav .menu li {
	display: inline-block;
	font-size: 1em;
	line-height: 1;
}

#TopNav .menu li a {
	display:block;
  padding: 10px ;
  color: #efefef;
	text-decoration:none;
}

#TopNav .menu li a:hover,
#TopNav li.current_page_item  a {
	background:#E53916;
	}

#social {
}
#social img:hover {
	opacity:0.80;
	}
	


/* =Content
-------------------------------------------------------------- */



.page-template-blog-page-php article,
.category-press-releases  article {
}

.sticky {
}
.home .entry-header {
}
	
.entry-meta {
	display: block;
}
.single-author .entry-meta .byline {
	display: none;
}
#content nav {
	display: block;
	overflow: hidden;
}
#content nav .nav-previous {
	float: left;
	width: 50%;
}
#content nav .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}
#content #nav-above {
	display: none;
}
.paged #content #nav-above,
.single #content #nav-above {
	display: block;
}
#nav-below {
	margin: 1em 0 0;
}
.page-link {
	clear: both;
	margin: 0 0 1em;
}
.page .edit-link {
	clear: both;
	display: block;
}

/* 404 page */
.error404 .widget {
	float: left;
	width: 33%;
}
.error404 .widget .widgettitle,
.error404 .widget ul {
	margin-right: 1em;
}
.error404 .widget_tag_cloud {
	clear: both;
	float: none;
	width: 100%;
}

/* Notices */
.post .notice,
.error404 #searchform {
	
}

/* Image Attachments */
.image-attachment div.entry-meta {
	float: left;
}
.image-attachment nav {
	float: right;
	margin: 0 0 1em 0;
}
.image-attachment .entry-content {
	clear: both;
}
.image-attachment .entry-content .entry-attachment {
	background: #eee;
	margin: 0 0 1em;
	padding: 1em;
	text-align: center;
}
.image-attachment .entry-content .attachment {
	display: block;
	margin: 0 auto;
	text-align: center;
}

/* Aside Posts */
.format-aside .entry-header {
	display: none;
}
.single .format-aside .entry-header {
	display: block;
}
.format-aside .entry-content,
.format-aside .entry-summary {
	padding-top: 1em;
}
.single .format-aside .entry-content,
.single .format-aside .entry-summary {
	padding-top: 0;
}

/* Gallery Posts */
.format-gallery .gallery-thumb {
	float: left;
	margin: 0 1em 0 0;
}

/* Image Posts */
.format-image .entry-header {
	display: none;
}
.single .format-image .entry-header {
	display: block;
}
.format-image .entry-content,
.format-image .entry-summary {
	padding-top: 1em;
}
.single .format-image .entry-content,
.single .format-image .entry-summary {
	padding-top: 0;
}

figure {margin: 0;}



/* =Images
-------------------------------------------------------------- */

a img {
	border: none;
}
p img {
	margin-bottom: 0.5em; /* a small bottom margin prevents content floating under images */
}
/*
Resize images to fit the main content area.
- Applies only to images uploaded via WordPress by targeting size-* classes.
- Other images will be left alone. Use "size-auto" class to apply to other images.
*/
img.size-auto,
img.size-full,
img.size-large,
img.size-medium,
.attachment img,
.widget-area img,
.wp-caption {
	max-width: 100%; /* When images are too wide for containing element, force them to fit. */
	height: auto; /* Override height to match resized width for correct aspect ratio. */
}
img.alignleft {
	margin-right: 1em;
	margin-bottom: 1em;
}
img.alignright {
	margin-left: 1em;
	margin-bottom: 1em;
}
.wp-caption {
	padding: 0em;
	text-align: center;
}
.wp-caption img {
	margin: 0em;
}
.wp-caption .wp-caption-text {
	padding: .4em;
	background: #EFEFEF;
	margin-top: -10px;
	font-style: italic;
	font-size: .9em;
}
.gallery-caption {
}
.wp-smiley {
	margin: 0;
}


.typography img {
	max-width: 100%;
	height: auto;
	}


/* =Forms
-------------------------------------------------------------- */

#searchform label {
	
}
/*
#searchform input#s {
	width: 60%;
}
*/
input[type=text],
input[type=email],
input[type=tel],
textarea,
select,
input#s {
	margin:  0 0 15px 0;
	width: 98%;
	font-size: 1em;
	color: #E53916;
	padding: 8px;
	background:#EFEFEF;
	border: 1px solid #EEE;
	box-sizing: border-box;
}
textarea {
	width: 98%;
}

input[type="button"], input[type="submit"], input[type="reset"] {
	
}

input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover {  }

select {
	color:inherit;
}


#search {
	
}

header #searchform {
	float: right;
}

#searchform div {
	float: left;
	margin: 6px 0 0 0 ;
	position: relative;
	
}
#searchform input[type=text] { 
	display: inline-block;
	background:#FFF; 
	border:1px solid #DDD;
	width: auto; 
	margin:0;
	padding:  0 30px 0 12px;
	height: 29px;
	font-size:1em;
	line-height:1;
	color: #555;
	float:left;
	
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	}

#searchsubmit {
	width: 38px;
	border:none;
	padding:0;
	background: none;

	position: absolute;
	right: 0;
	z-index: 99;
	top:0;
	bottom: 0;
	margin:0;
	padding: 0;
}
#searchsubmit:hover { cursor:pointer;	}
#searchsubmit:active {	 }


/* Font Awesome Search Icon */
i.fa.fa-search { font-size: 1.5em; color: #BBB; }
#searchsubmit:hover i.fa.fa-search { color: #666; }
#searchsubmit:active i.fa.fa-search { color: red; }


/* Class for labelling required form items */
.required {
	color: #cc0033;
}


/* Contact Form 7 */
div.wpcf7-mail-sent-ok {
background: #444 !important;
margin: 0 !important;
color: #FFF !important;
border: 0 !important; }



/* =Comments
-------------------------------------------------------------- */

article.comment {
	display: block;
}
#respond input[type=text] {
	display: block;
	width: 60%;
}
#respond textarea {
	display: block;
	margin: 0 0 1em;
	width: 80%;
}
#respond .form-allowed-tags {
	clear: both;
	width: 80%;
}
#respond .form-allowed-tags code {
	display: block;
}


/* =Widgets
-------------------------------------------------------------- */


.widget {
	margin: 0 0 20px 0;
	padding: 0 0 15px 0;
	border-bottom: 1px solid #DFDFDF;
	
}
.widget.widget_search {
	overflow: hidden;
	background:none;


}
.widget-area .widget_search input {
	float: left;
}
.widget-title,
#secondary .widget-title {
	font-size: 1.3rem;
	line-height:1;
	letter-spacing: 1px;
	font-weight:normal;
}

.widget ul,
#secondary .widget ul {
	margin:0;
	padding: 0;
}

.widget li {
	list-style:none;
	display:block;
	padding: 0 ;
	margin:0;
	/*border-bottom: 1px dotted #DFDFDF;*/
}

.widget li a {
	display:block;
	font-size: 1rem;
	line-height: 1.1;
	color:#E53916;
	letter-spacing: 1px;
	padding: 7px  0;
	text-transform: none;
}


.widget a {
	text-decoration: none;
}
.widget a:hover {
	text-decoration: none;
}

.widget li a {}


.widget select { margin: 0 ; }


	

/* = Side Menu
-------------------------------------------------------------- */

#side-menu .section-title  {
	padding: 0 0 10px 0;
	letter-spacing: 3px;
	text-transform: uppercase;
	border:none;
}
#side-menu .section-title a {
	font-size: 1.3rem;
		line-height: 1.1;
		letter-spacing: 1px;
}

#side-menu ul {
	margin:0;
	padding: 0;
}
#side-menu li {
	margin:0;
	padding:  0;

}
#side-menu li a {
	font-size: 1.0rem;
	text-decoration: none;

}
#side-menu li:hover a,
#side-menu li.current_page_item a {
	color:#333;
}
#side-menu li:hover {
}


#side-menu li ul.children { display:none; margin-left: 20px; font-size: 0.90em; }
#side-menu li.current_page_item ul.children,
#side-menu li.current_page_parent ul.children { display:block;}




/* = PKD Content
-------------------------------------------------------------- */

/* PARAGRAPHS */
.typography {
	color:#555;
	font-size: 1em;
	line-height: 1.7;
}

.typography p {
	margin: 0 0 1em 0;
}

.home .typography , .home .typography p {

}
.typography blockquote {
	margin: 0 0 0 2em;
	font-style: italic;
}	
.typography strong, .typography p strong {
	font-weight:bold;
}

.reverse, .reverse p, .reverse h1, .reverse h2, .reverse h3, .reverse h4, .reverse h5, .reverse h6,
.typography .reverse, .typography .reverse p, .typography .reverse h1,
.typography .reverse h2, .typography .reverse h3, .typography .reverse h4, .typography .reverse h5, .typography .reverse h6,
.typography .reverse a, .typography .reverse p a, .typography .reverse h1 a,
.typography .reverse h2 a, .typography .reverse h3 a, .typography .reverse h4 a, .typography .reverse h5 a, .typography .reverse h6 a { color: #FFF; }

/* LINKS */

.typography a {
 	text-decoration: none;
}
.typography a:hover { 
 	text-decoration: underline;
}


/* LIST STYLES */
.typography div + ul, 
.typography div + ol {
	padding: 0 1.2em 1em;
	margin: 0; 
	margin-top: -1em;
}

.typography div + li {
	list-style:outside square;
	line-height: 1.5;
	padding-bottom: .2em;
}

.typography ul#times { list-style:none; }

.typography ul.twocolumns li {
	width: 48%;
	float:left;
	padding-right: 2%;
}
	


/* HEADER STYLES */

.page-header {
	clear: both;
    padding: 1em 0 2em;
}

.typography h1,
.typography h2,
.typography h3,
.typography h4,
.typography h5,
.typography h6 {
	font-weight:normal;
	/*padding: 0.7em 0 0.3em ;*/
	clear:none;
	margin:0;
	line-height:1.2;
	letter-spacing: 1px;
	padding: 0 0 1em 0;
}

.typography .entry-title,
.typography .page-title  {	
	color: #999;
	font-weight:normal;
	letter-spacing:2px;
	text-transform:uppercase;
	font-size: 2.5em;
	line-height: 1;
	padding:0;
}
.typography h1 {
	font-size: 3em;
}
.typography h2 { 
 	font-size: 2em; 
}
.typography h3 {
	font-size: 1.5em;
}
.typography h4 {
	font-size: 1.25em;
}
.typography h5 {
	font-size: 1em;
}
.typography h6 {
	font-size: .9em;
}


.typography .entry-content *:first-child {  }


/* TABLE STYLING */
.typography table.datatable {
	margin: 10px 0;
	color: #444;
	border-collapse:collapse;
}
.datatable td,
.datatable th {
	border:1px solid #DDD;
	padding:4px 12px;
	text-align:left;
}
.datatable th {
	background: #DDD;
	border:1px solid #CCC;
}



/*  ADJUSTMENTS */

.typography h2+p, .typography h3+p, .typography h4+p, .typography h5+p, .typography h6+p  { margin-top: -1em; } 




/*  ALIGNMENT CLASSES */
.typography .left {
	text-align:left;
}
.typography .center {
	text-align:center;
}
.typography .right {
	text-align:right;
}
.typography img.right {
	float:right;
	margin-left:20px;
}
.typography img.left {
	float:left;
}
.typography img.leftAlone {
	float: left;
	margin-right: 100%;
}
.typography img.center {
	float:none;
	margin-left:auto;
	margin-right:auto;
	display:block;
}



/* Button */

.wp-block-button__link {
	
}

.button, .wp-block-button__link {
	display:inline-block;
	position: relative;
	background: #FFF;
	padding: .8em 1.8em 0.8em 1.8em;
    color: #FFF;
    font-size: 1em;
	line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 2px;
	border: 1px solid #999;
	text-align: center;
	margin: .5em;
}
 a.button,
.typography a.button, 
.typography a.wp-block-button__link { text-decoration: none; }
 
input[type=submit].button {color: #FFF}


.button + .button {  }

.button.reverse {
	color: #FFF;
	background: #333;
	border: 1px solid #000;
}

.button.small {
	font-size:.8em;
}


.button:hover, a.button:hover,
a.wp-block-button__link:hover {
    background: #999999;
	cursor:pointer;
	text-decoration:none;
}

.button.reverse:hover,
input[type=submit].button:hover {
	color: #FFF;
	background:#666;
	}

.button a:hover { text-decoration: none; }


/* =Video
-------------------------------------------------------------- */


.pkd-video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	width: 100%;
	overflow: hidden;
}

.pkd-video-container iframe, .pkd-video-container object, .pkd-video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#PKD-Video .wp-video{
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	width: 100% !important;
	overflow: hidden;
}
#PKD-Video .wp-video iframe, #PKD-Video .wp-video .wp-video-shortcode, .wp-video object, .wp-video embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}

.wp-video .mejs-container .mejs-controls {
    visibility: hidden;
}

.wp-video .mejs-container:hover .mejs-controls {
    visibility: visible;
}



/* =Footer
-------------------------------------------------------------- */

#colophon {
}

#colophon a, .footer-column a { }
#colophon a:hover, .footer-column a:hover { }

.footer-column {   	
	
}

.typography .footer-column p {
}

#footer1 {   }
#footer2 {  }
#footer3 { }
#footer4 { }

.footer-widget {
	
}
.footer-title {
	font-size: 150%;
	font-weight:normal;
	letter-spacing: 1px;
	color:#FFC;
}

.footer-widget ul {
	margin: 0; padding: 0;
}
.footer-widget li {
	list-style:none;
}
.footer-widget li a {
	color:#CCC;
	text-decoration: none;
}

.footer-widget li a:hover {
	color: #FCB813;
}

#site-generator { display:none; }

#copyright { 								
	font-size: .75em;
	text-align:center; 
	clear: both;
	letter-spacing: 1px;
	padding: 3em 0;
		}
#copyright a { 
	text-decoration:none;
}




/* =Date Box 
-------------------------------------------------------------- */


.entry-date { 
}
.entry-month {
}
.entry-day {
}
.entry-year {
}



.entry-date.date-badge { 
	font-family: 'PT Sans Narrow', sans-serif;
	float: left;
	margin: 0 20px 20px 0 ;
	border: 1px solid #E53916;
	width: 60px;
	height: 80px;
}
.date-badge .entry-month {
	background: #E53916;
	color: #FFF;
	text-transform: uppercase;
	padding: 2px 2px 2px 6px;
	text-align: center;
	letter-spacing: 2px;
	font-size: 24px;
	line-height: 1;
	display: block;
}
.date-badge .entry-day {
	font-size: 46px;
	line-height: 1;
	padding-top: 5px;
	color: #777;
	text-align: center;
	background: #FFF;
	display: block;
}
.date-badge .entry-year {
	font-size: 23px;
	line-height: 1;
	padding-top: 5px;
	color: #777;
	text-align: center;
	background: #FFF;
	display: block;
	}


/* =PAGE 
-------------------------------------------------------------- */	

.page #main article {
}
.page #main article .entry-content {
	
}
.page-thumb {
	width: 300px;
	height: 300px;
	margin: 0;
	background: #EFEFEF;
}
.page-thumb img {
	width: 100%;
	height:	100%;
}



/* =GENERAL ARCHIVE Section
-------------------------------------------------------------- */

.archive-flex { display: flex; }




/* =Portfolio Section
-------------------------------------------------------------- */


.port-column { display:inline-block; vertical-align: top;}
#column1  {width: 65%;} 
#column2 {width: 30%; margin-left: 4%;}


.single-portfolio .site-width { } 
.single-portfolio #main article .entry-content { 
	/*display: inline-block;
	vertical-align: top;
	margin-top: 77px;
	width: 100%;
	padding: 20px 0; */
	
	}

.single-portfolio #main, 
.single-portfolio #main .site-width {  padding-top: 0;}
.single-portfolio .entry-header {}
.single-portfolio .entry-header .entry-title {
	font-size: 170%;
	padding: 5px 0;
	letter-spacing: 5px;
}



.portfolio-archive-thumb {}

.typography  .portfolio-archive a .portfolio-info {
	display: table;
	width: 100%;
	height: 46px;
	position: absolute;
	bottom: 0;
	z-index: 20;
}
.typography  .portfolio-archive a .portfolio-info h2.portfolio-title { 
	font-size: 110%; 
	letter-spacing: 2px; 
	padding:  0; 
	text-align: center; 
	color: #EEE; 
	background: rgba(77,77,77,.7); 
	line-height: 1.1; 
	display: table-cell;
	vertical-align: middle;
	
	}
.typography  .portfolio-archive a:hover h2.portfolio-title { background: rgba(230,57,22,.7);   }
.typography  .portfolio-archive a { text-decoration:none;   }


.portfolio-flex {
    display: flex;
    flex-wrap: wrap;
	justify-content: space-between;
}

.portfolio-archive {
    position: relative;
    width: 32vw;
    height: 21.3vw;
    margin: 0 0 2vw 0;
}
.portfolio-archive:nth-child(4n+1) {
}
.portfolio-archive:nth-child(4n+4) {
}
.portfolio-archive a {
	width: 100%;
	height: 100%;
	display: block; 
	}
/*.portfolio-archive:nth-child(9),
.portfolio-archive:nth-child(10),
.portfolio-archive:nth-child(11),
.portfolio-archive:nth-child(12)
 { margin-bottom: -16px;}*/



.typography #project-table {
	float: left; 
	margin:  20px 0 30px 0 ;
}

.typography #project-table td {
	vertical-align:top;
	font-size: 90%;
	line-height: 1.5;
}


#single-slider { margin: 0 0 30px 0; }

.category-title {
	color:#E53916 ;
	font-size: 50%;
}


.typography .archive-list a { text-decoration:none; }


/* =Staff Section
-------------------------------------------------------------- */


.single-staff .entry-content {  }
.single-staff .staff-meta {  }
h1 .staff-title { font-size:1.1em; color: #666; margin-top: 8px; }

.staff-archive { 

}

.post-type-archive-staff .staff-photo { }
.post-type-archive-staff .staff-person { }
.post-type-archive-staff .staff-title {  } 



/* =Locations Section
-------------------------------------------------------------- */
.post-type-archive-locations #featured-image,
.single-locations #featured-image {
	background-image: url('http://toxstrategies.peterkingdesign.com/wp-content/uploads/2015/03/Austin-TownLake-Skyline-1400x300.jpg') !important;
	background-size: cover !important;
	background-position: 50% !important;
	width: 100% !important;
	height: 100% !important;
	}

.locations-archive { 
	display: inline-block;
	width: 32%;
	margin: 0 1% 30px 0;
	vertical-align:top;
}
.locations-archive img { width: 100%; height:auto; 
}

.archive-item span { display:inline-block; width: 100px; text-transform:uppercase;}

.acf-map {
	width: 100%;
	height: 400px;
	border: #ccc solid 1px;
	margin: 20px 0;
}



/* =Services Section
-------------------------------------------------------------- */
.services-archive { 

}
.services-archive img { }


/* =Blog Section
-------------------------------------------------------------- */




/* =SOCIAL MEDIA 
-------------------------------------------------------------- */
	
#socialmedia .fontawesome-text { display:none; }
	
#socialmedia {  
	float:none; 
	margin:0;
	display: flex;
    justify-content: center;
 }

#socialmedia .menu li a {  	padding:0; }

#socialmedia i { 

	display:block;
	font-size: 1.3em;
	width: 34px;
	height: 34px;
	line-height: 34px;
	text-align: center ;
	background: rgba(255,255,255,.35);
	border: 1px solid transparent;
	margin-right: .3em;
	
	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

#socialmedia .menu li a:hover { background: none; }

#socialmedia a {text-decoration: none;}



#socialmedia #Facebook:hover i { background-color: #3e5b98; border-color:#999; }
#socialmedia #Twitter:hover i { background-color: #4da7de; border-color:#999; }
#socialmedia #Youtube:hover i { background-color: #e02a20; border-color:#999; }
#socialmedia #Envelope:hover i { background-color: #222222; border-color:#999; }
#socialmedia #Yelp:hover i { background-color: #c83218; border-color:#999; }
#socialmedia #Linkedin:hover i { background-color: #3371b7; border-color:#999; }
#socialmedia #Pinterest:hover i { background-color: #E60023; border-color:#999; }
#socialmedia #Instagram:hover i { background-color: #8a3ab9; border-color:#999; }
#socialmedia #Houzz:hover i { background-color: #4DBC15; border-color:#999; }

.fa-facebook-f:before { content:'\f39e'; }



.entry-content .fa, .entry-content .far, .entry-content .fas { 
color: #999; 
padding-right: .3em;
width: 1em; }




/* =Simple Grid Override
-------------------------------------------------------------- */



/* =Gravity Forms Override
-------------------------------------------------------------- */

#main li.gfield { margin-top:0; }

#main div.ginput_container { margin-top:0; }

#main .gform_legacy_markup_wrapper li.hidden_label input { margin-top:0; }

#main .gform_legacy_markup_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]) {
	font-size: 1.1em;
    padding: 6px 0;
}

#main .gform_legacy_markup_wrapper .gsection .gfield_label, 
#main .gform_legacy_markup_wrapper h2.gsection_title, 
#main .gform_legacy_markup_wrapper h3.gform_title {
	font-weight: 400;
}

input[type=text], input[type=email], input[type=tel], textarea, select, input#s {
	margin:0;
	margin-bottom: 16px;
	
    background: #fff;
    border: none;
    border-bottom: 1px solid #ddd;
}

textarea, select {
	border: 1px solid #ddd; 
}



/* =Override
-------------------------------------------------------------- */
.tribe-events-list-widget ol li {
	margin-bottom: 0 !Important ;
}
li.tribe-events-list-widget-events { padding: 20px 0; }
li.tribe-events-list-widget-events:first-child { padding-top: 0; }

ul.tribe-events-sub-nav { display:none; }




/* =WORDPRESS OVERRIDE
-------------------------------------------------------------- */
.wp-block-table {
	margin: .5em 0 2em 0;
}



/* = CSS VH HEIGHTS
-------------------------------------------------------------- */

/* Best for full width sections */
.vh-full {height: 100vh;}
.vh-100 {height: 100vh;}
.vh-90 {height: 90vh;}
.vh-80 {height: 80vh;}
.vh-75 {height: 75vh;}
.vh-70 {height: 70vh;}
.vh-66 {height: 66vh;}
.vh-60 {height: 60vh;}
.vh-50 {height: 50vh;}

/* Alternate Adjsted for Header Height */
.vh-alt-full {height: calc(100vh - var(--header-height));}
.vh-alt-100 {height: calc(100vh - var(--header-height));}
.vh-alt-90 {height: calc(90vh - var(--header-height));}
.vh-alt-80 {height: calc(80vh - var(--header-height));}
.vh-alt-75 {height: calc(75vh - var(--header-height));}
.vh-alt-70 {height: calc(70vh - var(--header-height));}
.vh-alt-66 {height: calc(66vh - var(--header-height));}


/* Best for content */
.vh-min-full {min-height: calc(100vh - var(--header-height));}
.vh-min-90 {min-height: 90vh;}
.vh-min-80 {min-height: 80vh;}
.vh-min-75 {min-height: 75vh;}
.vh-min-70 {min-height: 70vh;}
.vh-min-66 {min-height: 66vh;}
.vh-min-60 {min-height: 60vh;}
.vh-min-50 {min-height: 50vh;}

.vh-min-full,
.vh-min-90,
.vh-min-80,
.vh-min-75,
.vh-min-70,
.vh-min-66,
.vh-min-60,
.vh-min-50 { padding:0; }

@media screen and (max-height: 890px) {  


	.vh-min-full,
	.vh-min-90,
	.vh-min-80,
	.vh-min-75,
	.vh-min-70,
	.vh-min-66,
	.vh-min-60,
	.vh-min-50 {min-height: auto; padding: 11vh 0 12vh 0;}
	
	
	.center-section-content-wrapper { 
		transform: none;
		top: auto;
		position: relative;
	}

}



/* =Slide IN Elements (See JS too)
-------------------------------------------------------------- */
.module {transform: translateY(150px);}

.come-in {
  transform: translateY(150px);
  animation: come-in 0.8s ease forwards;
}

/*.come-in:nth-child(odd) {
  animation-duration: 0.6s;  So they look staggered 
}*/

@keyframes come-in {
  to { transform: translateY(0); }
}




/* =Responsive Actions
-------------------------------------------------------------- */



@media screen and (max-width: 1240px) {  
body {	 }
body.home { }

#main {
}
.home #main, .single-portfolio #main { margin:0; }


#page {	 }
#primary {  }
#secondary {width: 180px;
background-size: contain;}

.site-width { width: auto; margin: 0 2%; }

.main-logo { }


#portfolio-archive-group {  }
.portfolio-archive {  }


.locations-archive { width: 31%; }


}

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

}


@media screen and (max-width: 1024px) {  
.main-logo { width: 370px;}

}


@media screen and (max-width: 959px)  {  
body {	font-size: .9375em; }
#page {	width: 100%; }
#main { padding-top: 0; margin-top: 64px;}
	.home #main {margin-top: 0;}
#primary { width: initial; float:none; padding: 0; margin: 0 ;}
#secondary { width: initial; float:none; background:none; min-height: initial; padding: 0;}
#colophon {  margin-top: 0;}
#FixedHeaderSpacer { height: 0px;  }


.site-width { }
	
.site-width.skinny { margin: 0 2%; width: 96%; }


.alignleft, .alignright, .aligncenter   { display: block; float: none; margin:0;}
img.alignleft, img.alignright { margin:0 0 10px 0; padding:0; }

#branding {position: relative;
height: 60px;}
#branding .borderline { top: 55px; }
#banner {}
.main-logo {height: 60px; width: 300px;}


#phone { margin: 2px 0 0 0; height:20px; }

#phone h2.header-title { letter-spacing: 1px; font-size: 110%; }

.home #banner { }
#slideshow-content { width: 45%; height: 168px;}
.slideshow-title {font-size: 160%; letter-spacing:1px;}
.slideshow-text { font-size: 80%; line-height: 1.1; }
.slideshow-text blockquote { text-indent: -5px; }
.button, .button-rev { min-width: initial; background-size: 100% 60%;}

#col1.home-column, #col2.home-column, #col3.home-column { width: 100%; display: block;}




#hamburger { display:block; }
#mainnav #main-menu {display:none; }
#mainnav #responsive-menu {	display:block;	}
#mainnav.openmenu #responsive-menu { left: 0%; }
#mainnav #responsive-menu ul { display: block; 	padding-top: 1.1em;}
#mainnav #responsive-menu ul li { display: block; width: auto; }
#mainnav #responsive-menu ul li a{ padding: 1.1em 1.5em; text-align: left; font-size: 1.2em; line-height: 1.1; color: #FFF; }
#mainnav #responsive-menu ul li .sub-menu { display:none; }



#side-menu ul { margin:0; }
#side-menu li { background-size: 100% 1px; }
#side-menu li  a { padding: 4px 10px 4px 25px; font-size: 110%; }


.typography .home-columns h2.column-title { padding: 6px 0; font-size: 220% }
.home-columns { width: 100%; padding: 0; margin: 0; min-height:initial; }
.home-columns .column-content {height: initial; }

.typography h1.entry-title {  font-size: 180%; letter-spacing: 1px; padding-bottom: 10px; }
	
	
	


.portfolio-archive {    width: 48.5%;
    height: 32vw;
    margin-bottom: 3vw;}
.single-portfolio .entry-header { top:0; }
.single-portfolio .entry-header .entry-title { font-size: 18px; }


.single-staff .staff-meta, .single-staff .entry-content { float:none; width: auto; }

.page #main article { }
.page-thumb { width: 20%; height: auto; clear:both;}
.page #main article .entry-content { margin-right: 0; }

input[type=text], input[type=email], input[type=tel], textarea, select, input#s { width: 95%;}
} 

@media screen and (max-width: 599px) {  
.portfolio-archive {}
.main-logo { width: 200px; background-size:contain; }
.typography .portfolio-archive a h2.portfolio-title { font-size: 120%; letter-spacing: 4px; }

	.footer-column {float: none;}

}

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

.portfolio-archive { width: 100%; height: 66.7vw; }


}