/*
Theme Name: kdw-framework4
Theme URI: http://keydesigndevelopment.com
Author: Thomas W Craig III & Name goes here
Author URI: http://keydesignwebsites.com/
Description: Key Design Websites Framework 4 is an in-house starter theme. The kdw-framework4 is a mobile friendly theme/framework that uses html5 and css3 concepts. The core is _s from Automatic and Foundation from Zurb with ported kdw-framework3 ACF Website Options, including Custom Branding Integration. Supports Header 100% and Content that is 100% or 60%/40% 3.x translated to (8/4) Zurb Foundation Grid of the viewable area and global or page specific sidebars. Simple Zurb Foundation classes can easily be added to simplify and enhance the site experience and functionality.
Version: 1.0.0002
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kdw-framework4
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

kdw-framework4 is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/
/*
*******************************************************************************************************************
*******************************************************************************************************************
*/
/*
This theme is built for Key Design Websites and implements _s from Automatic and the Zurb foundation css framework. 
For this theme I have separated out the css sheets to make it easier to migrate from 3.x to 4.x

Please do not modify the normalize.css or the underscores.css sheets. The underscores.css by my default commented out.
The framwork3.x sheet is also commented out and is from well our 3.x theme and is for testing and comparison.

Try to use the .classes as described in the docs http://foundation.zurb.com/docs/

The header and footer are set to be 100% width. 

The page content .row is either medium-12 large-12 columns in full-width or medium-8 large-8 columns + medium-4 large-4 columns with sidebars.

The contact .row is either medium-6 large-6 columns in full-width or medium-4 large-4, medium-4 large-6, medium-4 large-2 with sidebars.

Minimal css has been used in the set-up of this theme/framework in an effort to reduce build time. 

Make modifications in .the responsive.css for anything responsive that can not be handled by the foundation css framework.
*/
/*
*******************************************************************************************************************
** STYLE SHEET INCLUDES
*******************************************************************************************************************
*/
@import url( 'normalize.css' );
/*@import url( 'underscores.css' );*/
/* @import url( 'framework3x.css' ); */
/*
*******************************************************************************************************************
** STYLES
*******************************************************************************************************************
*/
html {font-family: 'Open Sans', sans-serif; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;}
body {margin: 0; font-family: 'Open Sans', sans-serif;}
h1, h2, h3, h4, h5, h6 {font-family: 'Open Sans', sans-serif;}
body {background-color: #fff;}
.entry-title {display: hidden; display: none; }
.empty-h-tag {display: hidden; display: none; }
#content {width: 100%;}
#content.site-content.row {max-width: 100%; width:100%;}
.template-fullwidth .aside {display: none;}
h2.headerphone.subheader a {color: unset;}

/************* TOP BAR NAV *************/
.top-bar-section li:not(.has-form) a:not(.button) {padding: 0 1.8em; line-height: 5.0rem; background: #000;}
.top-bar {height: auto;}
.top-bar .title-area {width: 37%;}
.top-bar .name{color: #fff; font-weight: bold; letter-spacing: 0; text-transform: uppercase; font-size: 1.714em;}
.top-bar .name a{color: #fff;}
.top-bar-section ul li > a {display: block; width: 100%; color: #fff; font-family: 'Open Sans', sans-serif; font-size: 0.923em;  font-weight: normal; text-transform: uppercase;}
.main-navigation {background: #000 none repeat scroll 0% 0% !important;}

/************* TOP-BAR SHRINK *************/
.top-bar.shrink {height: 3.546em;filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0.6);opacity:0.6;transition: all .5s ease;}
.top-bar.shrink ul {height: 3.546em;transition: all .5s ease;}
.top-bar.shrink nav a {line-height: 3.546em;transition: all .5s ease;}
.top-bar-section.shrink li:not(.has-form) a:not(.button) {line-height: 3.546em;}

/************* OFF-CANVAS MOBILE NAV *************/
.left-off-canvas-menu ul{list-style-type: none; padding-top: 0.385em;}
.left-off-canvas-menu ul li a{color: #fff; text-transform: uppercase; padding: 0.385em 0 0.385em 0.385em; display: block;}
.left-off-canvas-menu { background: #000 none repeat scroll 0% 0%;}
aside.left-off-canvas-menu {min-height:100vh;}
.right-off-canvas-menu ul{list-style-type: none; padding-top: 0.385em;}
.right-off-canvas-menu ul li a{color: #fff; text-transform: uppercase; padding: 0.385em 0 0.385em 0.385em; display: block;}
.right-off-canvas-menu { background: #000 none repeat scroll 0% 0%;}
aside.right-off-canvas-menu {min-height:100vh;}
.off-canvas-extra-content-top, .off-canvas-extra-content-bottom {color: #fff;}
#page.site {min-height:100vh;}
ul#header-menu.menu {list-style-type: none;}
.off-canvas-extra-content-top, .off-canvas-extra-content-bottom {margin: 0 0.385em 0 0.385em;}

#left-off-canvas-menu a:after {content: "Menu"; margin: 0 10px 0 10px; color: #fff;}
#right-off-canvas-menu a:before {content: "Menu"; margin: 0 10px 0 10px; color: #fff;}
.tab-bar a:after {content: "Menu"; margin: 0 10px 0 10px; color: #fff;}



/************* DEFAULT NAV *************/
.header-navigation {width: 100%;height: auto;clear: both;}
.menu a, .menu a:link, .menu a:visited {color: #fff;}
.menu .current-menu-item a {color: #C8C8C8;}
.menu-header-menu-container ul li { display: inline-block; }
.current-menu-item a { text-decoration: none; color: #C8C8C8; background-color: inherit; }
.menu {text-transform: none; font-family: inherit; letter-spacing: 0; float: none; background: transparent; padding: 1.429em; opacity: 0.6;}
.menu a, .menu a:link, .menu a:visited { text-decoration: none; color: #fff; padding: 0.000em 0.714em; }
.menu .current-menu-item a { text-decoration: none; color: #EAF1F9; background-color: inherit; }
.menu a:hover, li.menu-hover > a { color: #C8C8C8; }
.menu li:hover, li.menu-hover { background: inherit; }
#header-menu .sub-menu {display:none; position:absolute;}
nav ul#header-menu.menu li:hover ul {display:block;}
nav il#header-menu.menu {position:relative;}

.menu ul ul { display: none !important; position: absolute; z-index: 1000000; top: 0; left: 100%; }
.menu li ul li:hover ul { display: block !important;}

/* Submenus */
.menu-header-menu-container ul ul li { display: block; }
.menu ul { display: none; position: absolute; z-index: 1000000; float: none; margin: 0; }
.menu ul ul { top: 0; left: 100%; }
.menu ul { border: 1px solid #C8C8C8; background: #000; }
.menu ul.sub-menu a { padding: 8px 15px; border-right: none; border-bottom: 1px solid #C8C8C8; }

/* Submenu item hover */
.menu ul.sub-menu a:hover { color: #EAF1F9; }

/*** HAMBURGER ICON COLOR ***/
.tab-bar .menu-icon { color: #000;}
.tab-bar .menu-icon span::after {box-shadow: 0 0 0 0.077em #fff, 0 0.538em 0 0.077em #fff, 0 1.077em 0 0.077em #fff; width: 1rem; }
.tab-bar .menu-icon span:hover:after { box-shadow: 0 0 0 0.077em #b3b3b3, 0 0.538em 0 0.077em #b3b3b3, 0 1.077em 0 0.077em #b3b3b3; }

/************* SOCIAL *************/
ul.header-social {list-style: none;}
.header-social {list-style-type: none;float: right;margin: 0;padding: 0;}
.header-social li {float: left;	margin: 0 0.231em;padding: 0.077em;}
.header-social li a {opacity: 0.8;}
.header-social li a:hover {opacity: 1.0;}
.header-social li a img {height: 1.846em !important;width: auto;}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {clip: rect(0.077em, 0.077em, 0.077em, 0.077em); position: absolute !important; height: 0.077em;width: 0.077em; overflow: hidden;}
.screen-reader-text:focus {background-color: #f1f1f1; border-radius: 0.231em; box-shadow: 0 0 0.154em 0.154em rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b;display: block; font-size: 1.077em; font-size: 0.875rem; font-weight: bold; height: auto; left: 0.385em; line-height: normal; padding: 1.154em 1.769em 1.077em; text-decoration: none; top: 0.385em; width: auto; z-index: 100000; /* Above WP toolbar. */}

/*************SLIDESHOW & GALLERY *************/
.slideshow {width: 100%; margin: 0 auto; clear: both;}
.slideshow-featuredcontent .caption, .slideshow-nodescription .caption { visibility: hidden !important; }
#slideshow, #slideshow-gallery, .slideshow-gallery {display:none;}
.slideshow { visibility: hidden; } /* Turn images off until loaded */
/* BXslider We do not want any borders or background color */
.bx-wrapper .bx-viewport {-moz-box-shadow: unset;-webkit-box-shadow: unset; transform: unset;  box-shadow: unset;  border: unset;  background: unset; }
.bx-wrapper img {width: 100%;}
.bx-wrapper .bx-viewport {left: -0.000em;}
ul.slideshowheader  {margin-left: 0em;}

.gallery-row { padding-bottom: 1.538em; }
.gallery { list-style-type: none; float: left; margin: 0 !important; padding: 0; width: 100%; }
.gallery li {
	float: left;
	width: 18%;
	margin: 1%;
	opacity: 0.8;
	-moz-transform: scale(1.0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-webkit-transform: scale(1.0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-o-transform: scale(1.0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-ms-transform: scale(1.0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	transform: scale(1.0) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-webkit-transition: all 250ms ease;
	-moz-transition: all 250ms ease;
	-ms-transition: all 250ms ease;
	-o-transition: all 250ms ease;
	transition: all 250ms ease;
}
.gallery li:hover {
	opacity: 1.0;
	-moz-transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-webkit-transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-o-transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-ms-transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	transform: scale(1.1) rotate(0deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-webkit-transition: all 250ms ease;
	-moz-transition: all 250ms ease;
	-ms-transition: all 250ms ease;
	-o-transition: all 250ms ease;
	transition: all 250ms ease;
}

/*************COPYRIGHT/LEGAL MENU*************/
#copyright {padding-top: 1.538em;line-height: 1.923em;text-align: center;text-transform: uppercase;font-size: 0.769em;letter-spacing: 0.231em;}
#copyright, #copyright a, #copyright a:hover {text-decoration: none;color: #000;}
#developer { display: block; opacity: 0.6; -webkit-transition: all 450ms ease;-moz-transition: all 450ms ease;-ms-transition: all 450ms ease;-o-transition: all 450ms ease;transition: all 450ms ease; }
#developer:hover { opacity: 1.0; -webkit-transition: all 450ms ease;-moz-transition: all 450ms ease;-ms-transition: all 450ms ease;-o-transition: all 450ms ease;transition: all 450ms ease; }
.copyrightkey {	background: url('images/kdw-footer.png') left center no-repeat;	width: auto; height: 1.923em; display: inline-block; border: 0; padding-left: 1.923em;}
#menu-legal-menu.menu {text-transform: none; font-family: inherit; font-size: 0.714em; letter-spacing: 0; float: none; background: transparent; padding-bottom: 1.429em; opacity: 0.6;}
#menu-legal-menu.menu a, #menu-legal-menu.menu a:link, #menu-legal-menu.menu a:visited { text-decoration: none; color: #000; padding: 0.000em 0.714em; }
#menu-legal-menu.menu .current-menu-item a { text-decoration: none; color: #000; background-color: inherit; }
#menu-legal-menu.menu li a { border-right: none; }
#menu-legal-menu.menu a:hover, #menu-legal-menu.menu li.menu-hover > a { color: #000; }
#menu-legal-menu.menu li:hover, #menu-legal-menu.menu li.menu-hover { background: inherit; }
.menu-legal-menu-container { width: 100%; overflow: hidden; }
#menu-legal-menu { list-style: none; position: relative !important; float: left !important; display: block !important; left: 48%; }
#menu-legal-menu li { position: relative !important; float: left !important; display: block !important; right: 50%; }

/*************FOOTER ADDRESS*************/
ul.footer-addresses-location{list-style-type: none; text-align: center; text-transform: uppercase; font-size: 0.769em; letter-spacing: 0.231em;  padding: 0; margin: 0;}
.address-alink {color: #000;}
.address-alink:hover {text-decoration: none;}
.address-0, .address-1, .address-2 { border-right: 0.077em dotted #333; margin-right: 0.385em; }

/*************CONTACT PAGE*************/
.contact-column {margin: 0 2%;}
.contact-column-full {width: 100%; margin: 0;}
.contact-form {background-color: #ccc; padding: 0.769em;}
form .contact-website { position: absolute; left: -769230.692em; } /* 9999999px 769230.692em */
.directions-link {font-size: 0.8em; }
.gm-style img {max-width: 769230.692em !important;} /* 9999999px 769230.692em */
.acf-map {width: 100%; height: 23.077em; margin-top: 1.923em;}

/************* ACCORDION *************/
.accordion .accordion-navigation > a {
  position: relative;
  z-index: 10;
}
ul.accordion  {margin: 0;}
.accordion .accordion-navigation > .content {
  padding: 0 0.9375rem;
  height: 0;
  display: block;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  transition: all .5s ease;
}
.accordion .accordion-navigation > .content.active {
  height: auto;
  padding: 0.9375rem;
  filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
  opacity: 1;
}

/************* MISC/OTHER/TEST *************/
.row.my6by2row {margin: 0;}