/*
Theme Name: WP-Forge-Child
Theme URI: https://dev.brifishjones.com/wp-forge-child
Author: Brian Jones
Author URI: https://dev.brifishjones.com/
Template: wp-forge
Description: A WordPress child theme built using the latest version of Foundation for Sites, from Zurb, the most advanced responsive front-end framework in the world. By combining WordPress and Foundation you get a resposive WordPress theme that makes creating websites fun and exciting again! Please make sure you view the CHANGELOG and README files before/after installation and/or update.
Version: 6.4.3.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, one-column, two-columns, right-sidebar, left-sidebar, custom-background, custom-header, custom-menu, editor-style, featured-images, full-width-template, microformats, post-formats, sticky-post, translation-ready
Text Domain: wp-forge-child
*/

/**
 *
 * Table of Contents
 *
 * 1.0 - Reset
 * 2.0 - Accessibility
 * 3.0 - Repeatable Patterns
 * 4.0 - Basic Structure
 * 5.0 - Main content and comment content
 * 6.0 - Archives
 * 7.0 - Single image attachment view
 * 8.0 - Post Formats
 * 9.0 - Page Links
 * 10.0 - Comments
 * 11.0 - Front Page Template
 * 12.0 - Widgets
 * 13.0 - Social Menu
 * 14.0 - Misc
 * 15.0 - Media Queries
 */



@media only screen and (max-width: 40em) { /* max-width 640px, mobile-only styles, use when QAing mobile issues */
	}
@media only screen and (min-width: 40.063em) and (max-width: 64em) { /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
	}
@media only screen and (min-width: 64.063em) and (max-width: 90em) { /* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */
	}
@media only screen and (min-width: 90.063em) and (max-width: 120em) { /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */
	}
@media only screen and (min-width: 120.063em) { /* min-width 1921px, xlarge screens */
	}

body {
  background-color: #ffffff;
}
.top-bar {
  padding: 1.0rem 0 1.2rem 0;
  border-bottom: 1px solid #ff8888;
  border-bottom: 1px solid #dddddd;
}
.top-bar,.title-bar,.top-bar ul,.top-bar ul li,.contain-to-grid,.contain-to-grid .top-bar {
  background-color: transparent;
  font-size: 1.0rem;
  font-weight: 600;
  text-transform: uppercase;
}
.top-bar .menu .menu-item a {
  color: #182436;
  color: #444444;
  color: transparent;
}
.title-bar button.menu-icon:after {
  background: #ff4500;
  box-shadow: 0 7px 0 #ff4500, 0 14px 0 #ff4500;
  -webkit-box-shadow: 0 7px 0 #ff4500, 0 14px 0 #ff4500;
  background: #182436;
  box-shadow: 0 7px 0 #182436, 0 14px 0 #182436;
  -webkit-box-shadow: 0 7px 0 #182436, 0 14px 0 #182436;
}
.top-bar .menu .menu-item a:hover {
  color: #333333;
  background-color:#ffffff;
  text-decoration: underline;
}
.top-bar .menu .menu-item.current-menu-item {
  background-color:#ccffcc;
  background-color:#ffffff;
}
.top-bar .menu .menu-item.current-menu-item a {
  background-color:#ffffff;
  color: #556677;
  color: #182436;
  color: #444444;
  text-decoration: none;
}
.top-bar .menu .menu-item.current-menu-item a:hover {
  color: #444444;
}
.top-bar .fa-lg {
/*aside.left-off-canvas-menu .fa-lg {*/
  vertical-align: 0;
}

form#searchform {
  padding: 0.15rem 0 0 0;
}
input.animated-search-form[type=search] {
  width: 1rem;
/*  border: 0.125rem solid #e6e6e6;*/
/*  box-shadow: 0 0 3.125rem rgba(0, 0, 0, 0.18);*/
  border: none;
  border-radius: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  /*background-image: url("//image.ibb.co/i7NbrQ/search_icon_15.png");*/
  /*background-image: url("//dev.brifishjones.com/wp-content/plugins/font-awesome-4-menus/css/font-awesome.min.css");*/
  /*background-position: 0.625rem 0.625rem;*/
  /*background-repeat: no-repeat;*/
  padding: 0.75rem 1.25rem 0.75rem 2rem;
  transition: width 0.4s ease-in-out;
  background-color: transparent;
}
/*input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-text-fill-color: #fff !important;
}*/
/* Chrome: Change the white to any color ;) */
input.animated-search-form[type=search]:-webkit-autofill, 
input.animated-search-form[type=search]:-webkit-autofill:hover, 
input.animated-search-form[type=search]:-webkit-autofill:focus, 
input.animated-search-form[type=search]:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px white inset;
}
#searchform .fa-search {
  position: relative;
  left: 1.5rem;
  /*z-index: -1;*/
  background: transparent;
}
.animated-search-form[type=search]:focus {
  width: 100%;
  border: 1px solid #e6e6e6;
}
.content_wrap {
  padding-top: 2.5rem;
}
.entry-content-post pre, .entry-content-page pre, .comment-content pre {
  color: #444444;
  font-size: 0.85rem;
  padding: 0 0 0 0.8em;
  border-left: 0.5em solid #D8D8D8;
  background: white;
}
.entry-content-post h2 {
  font-size: 2.0rem;
  margin: 2.8rem 0 1.0rem 0;  
}
figure {
  max-width: 100%;
  max-height: 100%;
}
figure.alignleft {
  margin: 2.0rem 0 3.0rem 0;
  margin: 2.0rem 3.0rem 2.0rem -30%;
  float: left;
}
figure, figure.alignnone {
  margin: 2.0rem auto 3.0rem auto;
  float: none;
}
figcaption {
  padding: 0;
  line-height: 1.3;
  margin: 0.625rem 0 0 0;
}
p.footnote {
  padding: 0 0 0 1.3em;
  font-size: smaller;
  line-height: 1.3;
}
body:not(.home) article {
  margin: 0 10% 0 20%;
  /*width: 80.0vw;*/
}

/*
.top-bar,
.top-bar-left ul li,
.top-bar-right ul li,
nav.tab-bar.show-for-small-only,
.top-bar .name a,
aside.left-off-canvas-menu {
  background: none repeat scroll 0 0 #ffffff;
  color: #333840;
}
.top-bar-section ul{
  padding-right: 7px;
}
.top-bar-left > ul > .divider,
.top-bar-right > ul > .divider,
aside.left-off-canvas-menu {
  background: none repeat scroll 0 0 #ffffff;
  color: #333840;
}
.top-bar-section ul{
  padding-right: 7px;
}
.top-bar-left > ul > .divider,
.top-bar-right > ul > .divider,
.top-bar-left > ul > [role="separator"], 
.top-bar-right > ul > [role="separator"], 
nav.tab-bar.show-for-small-only section.left-small {
  border-right: 7px solid #ffffff; 
}
.top-bar-left ul li > a.button.secondary,
.top-bar-right ul li > a.button.secondary,
.top-bar .name a {
  background: #ffffff;
  font-size: 1.0em;
}
.top-bar-left ul li > a.button.secondary:hover,
.top-bar-right ul li > a.button.secondary:hover {
  background: #182436;
  color: #f3f3f3;
}
.tab-bar .menu-icon span:after {
    box-shadow: 0 0 0 1px #333840, 0 7px 0 1px #333840, 0 14px 0 1px #333840;
}
aside.left-off-canvas-menu ul li a.button.secondary {
  border-radius: 0;
  margin: 3px 11px 3px 8px;
}
.top-bar-left ul.right.search, 
.top-bar-right ul.right.search {
  width: 18.0em;
}
.top-bar-left ul.right.search li, 
.top-bar-right ul.right.search li {
  width: 17.5em;
}
input#searchsubmit {
  font-family: FontAwesome;
  height: 2.3125rem;
  background-color: #182436
}
*/

/*
.top-bar-section ul li > a, 
nav.top-bar ul.title-area li.name > a {
  font-size: 1.0rem;
  font-weight: 500;
}
.top-bar-section li:not(.has-form) a:not(.button),
ul.off-canvas-list li a, 
nav.top-bar ul.title-area li.name a,
nav.tab-bar.show-for-small-only a.left-off-canvas-toggle-menu-icon {
  background: none repeat scroll 0 0 #ffffff;
  color: #333840;
  line-height: 25px;
  padding: 0px 15px;
}
.top-bar-section li:not(.has-form) a:not(.button):hover,
ul.off-canvas-list li a:hover, 
nav.top-bar ul.title-area li.name a:hover {
  background: none repeat scroll 0 0 #333840;
  color: #f3f3f3;
  border-radius: 1000px; 
}
.top-bar-section > ul > .divider,
.top-bar-section > ul > [role="separator"], 
nav.tab-bar.show-for-small-only section.left-small {
  border: 0;
}
.top-bar-section li.active:not(.has-form) a:not(.button), 
.top-bar-section li.active:not(.has-form) a:not(.button):hover, 
ul.off-canvas-list li.active a, 
ul.off-canvas-list li.active a:hover {
  background: none repeat scroll 0 0 #ffffff;
  color: #445566;
  line-height: 25px;
}
ul.off-canvas-list li a, 
ul.off-canvas-list li a:hover {
  border-bottom: 1px solid #cccccc;
}
*/

/* only show header animation on the home page */
body:not(.home) #header.header_wrap.grid-container {
  display: none;
}

#header.header_wrap.grid-container {
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 100%;
}
#header.header_wrap.grid-container .grid-x.grid-padding-x .site-header.cell {
  padding: 0;
}

.header-info {
  background: url("images/bg-blue.jpg") no-repeat scroll top right / cover rgba(0, 0, 0, 0);
  height: 40.0vw;
  width: 100%;
}
.site-title, .site-description {
  letter-spacing: 4pt;
  width: 100%;
}
p.site-title, p.site-description {
  background-color: rgba(255, 255, 255, 0.0);
  margin: 0;
  font-family: 'Open Sans', sans-serif;
  /*font-size: 3.5vw;*/
  color: #f3f3f3;
  font-weight: 300;
  text-align: center;
  /*opacity: 0.8;*/
  width: 100%;
}
p.site-title {
  padding: 8.0vw 0 10.0vw 0;
}
p.site-title a {
  font-size: 3.0vw;
  color: #ff4500;
}
p.site-description {
  font-size: 5.0vw;
  /*display: none;*/
/*  -webkit-transform: translateZ(-5px) scale(2);
  transform: translateZ(-5px) scale(2);*/
}
p.site-description span {
  display: inline-block;
  
}

.supporticons a {
  color: #182436;
}
.supporticons a:hover {
  color: #283457;
  float: none !important;
  display: inline-block;
  vertical-align: top;
}
.gallery-item a, .gallery-caption {
  width: 100%;
}

#fancybox-title-inside {
  font-size: 1.125em;
  color: #757575;
  font-weight: 300;
  font-style: italic;
}

#wrapper {
 box-shadow: none;
}
@media only screen and (max-width: 40em) { 
  .header-info {
    height: 60.0vw;
  }
  p.site-title {
    font-size: 4.0vw;
    padding: 10.0vw 0 22.0vw 0;
  }
  .top-bar {
    padding: 0 0 1.2rem 0;
  }
  .top-bar .menu .menu-item a:hover {
    color: #333333;
    background-color:#eeeeee;
  }
  figure.alignleft {
    margin: 2.0rem auto 2.0rem auto;
    float: none;
  }
}
