/*
Theme Name: kdw-framework4
Theme URI: http://keydesigndevelopment.com
Author: Thomas W Craig III & Jessica Rodgers
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
*******************************************************************************************************************
*/
body {background-color: #fff;}
.entry-title {display: block; }
.empty-h-tag {display: hidden; display: none; }
#content {width: 100%;}
#content.site-content.row {max-width: 100%; width:100%;}
.contentinner,.headerinner{margin: 0 auto;}
.template-fullwidth .aside {display: none;}
h2.headerphone.subheader a {color: unset;}


/************* HEADER *************/

.header-logo-phone {
  	width: 100%;
  	height: auto;
	padding: 30px 0;
	border-bottom:  1px solid #0294d9;
}


.headercontact {
  float: right;
  margin: 0;
  text-align: center;
}

.headercontact span {
  text-transform: uppercase;
  color: #a3a9ab;
  font-size: 14px;
  display:  inline-block;
  margin-right:  30px;
}

h2.headerphone.subheader{
	padding: 0;
	margin: 0;
	line-height: 21px;
	  display:  inline-block;
	  font-family:  'Open Sans', sans-serif;
}

h2.headerphone.subheader a {
  	color: #0294d9;
	font-size: 21px;
  	text-decoration: none;
}


.header-slideshow-image{
	position: relative;
	height: auto;
}



.top-header{
	background: #dae0e0;
	padding: 4px;
}

.top-header h4{
	color: #a3a9ab;
	font-size: 12px;
	margin: 0; 
	padding: 0;
	line-height: 36px;
	letter-spacing: normal;
}

.tagline{
	background: rgba(70,70,70,0.5);
	padding: 55px;
}

.tagline h1{
	text-transform: uppercase;
	font-size: 60px;
	font-weight: 100;
	color: #fff;
	letter-spacing: 3px;
	margin: 15px 0;
	text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.8);
	text-align: center;
}

.tagline h2{
	text-transform: uppercase;
	text-align: center;
	color: #cbaf50;
	font-size: 18px;
	letter-spacing: 6px;
	font-weight: bold;
	margin: 0;
	text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.8);
}

.tagline .button{
	background-color: transparent;
	border: 1px solid #fff;
	margin-bottom: 0; 
	margin-top: 15px;
}


#secondary ul {list-style: none;}

/************* SIDEBAR *************/



.widget {
  margin: 0 auto;
}

.sidebar-header {
  padding: 10px 0;
  background-color: #ccc;
}

.sidebar-image {
  display: block;
  margin: 0 auto;
}

.widget-border {
  display: block;
  width: 100%;
  clear: both;
  margin: 0 auto;
}

.widget-location .acf-map {
  height: 400px;
}

.contact-form h2{
	font-size: 22px;
	letter-spacing: 1px;
}

/************* CALL TO ACTION *************/

.call-to-action ul{
	margin: 0;
	list-style: none;
}

.call-to-action li{
	width: 31.333%;
	float: left;
	margin: 1%;
	position:  relative;
	height: auto;
}

.call-to-action .hover-01{
	overflow: hidden;
}

.call-to-action h3{
	color:  #0295db;
	font-size: 18px;
	position: absolute;
	z-index:  30;
	bottom:  0;
	left: 0;
	right: 0;
	letter-spacing: 4px;
	margin: 0;
	background:  url('images/titlebg.png') no-repeat top left;
	padding: 50px 30px 20px;
}

.call-to-action .mg-image img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: all .3s ease-in-out;
}
.call-to-action .mg-image:hover img {
	-webkit-transform: scale(1.3);
	transform: scale(1.3);
}

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

#content {
  	clear: both;
	padding:  0 0 20px;
}

.home #content {
  	clear: both;
	padding: 20px 0;
}

.page-template-template-stylist .inner-content,
.single-stylists .inner-content{
	background:  url('images/pattern.png') repeat;
	padding: 60px 0;
}


.page-title { font-size: 14px; font-weight: bold; }
.page-title span { font-style: italic; font-weight: normal; }
.entry-title, .entry-title a { color: #cbaf50; font-size: 27px; line-height: 32px; padding: 0; text-transform: uppercase; letter-spacing: 2px; font-weight: 200;}
.entry-title a:hover { color: #2361a1; text-decoration: none; }

.entry-meta { opacity: 0.5; }

.entry-footer {
  text-align: right;
}

.type-post {
  border-bottom: 1px solid #ccc;
  padding-bottom: 0;
}

.contentblock {
  width: 100%;
  display: block;
  clear: both;
}

.contentblock-header {
  background-color: #ccc;
}

.block-single {
  float: left;
  margin: 0 1%;
  background-color: #f4f4f4;
}

.block-single-inner {
  padding: 10px 10px 0px 10px;
}

.block-single-inner p {
  padding-bottom: 10px;
}

/* DIRECTION CONTROLS (NEXT / PREV) */

.bx-wrapper .bx-prev {
	left: 10px;
	background: url(images/controls2.png) no-repeat 0 -86px;
}

.bx-wrapper .bx-next {
	right: 10px;
	background: url(images/controls2.png) no-repeat -86px -86px;
}

.bx-wrapper .bx-prev:hover {
	background-position: 0 0;
}

.bx-wrapper .bx-next:hover {
	background-position: -86px 0;
}

.bx-wrapper .bx-controls-direction a {
	position: absolute;
	top: 35%;
	margin-top: -16px;
	outline: 0;
	width: 78px;
	height: 78px;
	text-indent: -9999px;
	z-index: 80;
}
[data-magellan-expedition], [data-magellan-expedition-clone]{z-index: 100;}
[data-magellan-expedition-clone]{display: none !important;}
/************ HOME  **************/

.home-row-1 h2{
	font-size:  60px;
	color:  #0395da;
	line-height: 1.1;
	margin-bottom:  0;
	letter-spacing:  12px;
	font-family: 'Poiret One', cursive;
}


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

.top-footer{
	background:  url('images/footerbg.jpg') repeat-y;
	-webkit-background-size: cover;
 	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
  	padding: 40px 0;
}

.site-footer {
  	clear: both;
	background: #fff;
	border-top: 1px solid #ededed;
}

.widget-container{
	background: #fff;
	padding:  40px 0;
	text-align: center;

}

.widget-container .widget-title{
	color: #74787b;
	text-transform: uppercase;
	font-weight: bold;
}

.widget-container p, .widget-container a{
	color: #74787b;
	text-transform:  uppercase;
}

#menu-header-menu-1{
	margin: 0;
	padding: 0;
	list-style: none;
}

#menu-header-menu-1 li{
	display: block !important;
}
#menu-header-menu-1 li a{
	color: #74787b;
	padding-left: 0;
	padding-right: 0;
}


/************* FORMS & INPUT AREAS *************/

input, textarea, button { background: #fff; border: 1px solid #ccc; color: #000; font-size: 14px; max-width: 95% !important; padding: 5px; opacity: 0.6; -webkit-border-radius: 3px; border-radius: 3px; }
input[type="submit"] { font-size: 16px; padding: 2px 10px !important; cursor: pointer; }
input:focus, textarea:focus, input[type="submit"]:hover { border-color: #fff; opacity: 1.0; }
input[type="submit"]:active, input[type="submit"]:focus { background-color: #ccc; }
textarea { padding: 0px; margin: 0; width: 100%; }

/* bugfix */
.safari input { padding: 2px 5px; }
.chrome input { padding: 3px 5px; }

.requiredred { color: #c00 !important; }



/************* TEXT, TYPOGRAPHY & FORMATTING 
font-family: 'Poiret One', cursive;
font-family: 'Josefin Sans', sans-serif;

*************/

html {font-family: 'Josefin Sans', sans-serif; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;}
body {margin: 0; font-family: 'Josefin Sans', sans-serif;}
h1, h2, h3, h4, h5, h6 {font-family: 'Josefin Sans', sans-serif; color: #a3a7ab; text-transform: uppercase; }
h1 { font-size: 27px; line-height: 30px; padding: 5px 0px; }
h2 { font-size: 24px; line-height: 28px; padding: 5px 0px; }
h3 { font-size: 21px; line-height: 26px; padding: 5px 0px; }
h4 { font-size: 16px; line-height: 18px; padding: 5px 0px; }
h5 { font-size: 12px; line-height: 18px; padding: 5px 0px; }
h6 { font-size: 10px; line-height: 16px; }

address { font-style: italic; }
abbr[title], acronym[title], dfn[title] { cursor: help; border-bottom: 1px dotted #666; }

blockquote {
  font-style: italic;
  border-left: none;
}

p, ul, ol{
 	color: #74787b;
 	font-size:  18px;
 	line-height:  26px;
}

/************* IMAGES & CAPTIONS *************/

img.alignleft { float: left; margin-right: 20px; margin-top: 5px; }
img.alignright { display: block; float: right; margin-left: 20px; margin-top: 5px; }
img.aligncenter { margin-left: auto; margin-right: auto; display: block; clear: both; margin-top: 5px; }

.wp-caption { text-align: center; }
.wp-caption img { margin: 0; padding: 0; border: 0 none; }
.wp-caption .wp-caption-text { margin: 0; padding: 5px; }

/************* BUTTON *************/



.button{
	background: #a3a8ab;
	font-size: 14px;
	font-family: 'Open Sans', sans-serif;
	color: #fff;
	text-transform:  uppercase;
}

.button:hover, .button:focus{
	background: #888c8f;
}

.transparent{
	background-color: transparent;
	text-transform: uppercase;
	color: #fff;
	border: 1px solid #fff;
	padding-top: 8px;
	padding-bottom: 8px;
}
.transparent:hover,.transparent:focus{
	background-color: #a9a9a9;
}

.button.blue{

	font-family: 'Open Sans', sans-serif;
	color: #fff;
	font-size: 18px;
	background-color: #0494db;
}

.button.blue:hover,.button.blue:focus{
	color: #fff;
	background-color: #00abff;
}


.button-container{
	text-align: center;
}

/**************  FLEX VIDEO  ******************/

.flex-video {
  position: relative;
  padding-top: 0; 
  padding-bottom: 45.5%;
  height: 0;
  margin-bottom: 1rem;
  overflow: hidden;
}

.facebookbox.flex-video {
  position: relative;
  padding-top: 0; 
  padding-bottom: 92.5%;
  height: 0;
  margin-bottom: 1rem;
  overflow: hidden;
  width: 66%;
  display:  block;
  margin:  0 auto;
}

/************* 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;}
.header-navigation .main-navigation{background-color: transparent !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 {padding-top: 25px;}
#header-menu{margin: 0; float: right;}
#header-menu a{font-size: 13px; text-transform: uppercase; font-weight: 600; }
.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;}
.menu a, .menu a:link, .menu a:visited { text-decoration: none; color: #0294d9; padding: 0.000em 0.714em; display: block; }
.menu .current-menu-item a { text-decoration: none; color: #a3a8ab; background-color: inherit; }
.menu a:hover, li.menu-hover > a { color: #a3a8ab; }
.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: #fff; }
.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: #a3a8ab; }

/*** 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:20px 0 0;padding: 0;}
.header-social li, .mobile-social li {float: left;	margin: 0 0.231em;padding: 0.077em;}
.header-social li a  {opacity: 1.0;}
.header-social li a:hover{opacity: 0.8;}
.header-social li a img {height: 14px !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: 23%;
	margin: 1%;
	-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 {
	-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: 0.538em;line-height: 1.923em;text-align: center;text-transform: uppercase;font-size: 0.769em;letter-spacing: 0.231em; margin: 0;}
#copyright, #copyright a, #copyright a:hover {text-decoration: none;color: #74787b;}
#developer { display: block; -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: 0.5429em;}
#menu-legal-menu.menu a, #menu-legal-menu.menu a:link, #menu-legal-menu.menu a:visited { text-decoration: none; color: #74787b; padding: 0.000em 0.714em; }
#menu-legal-menu.menu .current-menu-item a { text-decoration: none; color: #74787b; 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: #74787b; }
#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: #f4f4f4; 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;}