/*
 Theme Name:     Squawkfox-Avada
 Theme URI:      http://www.squawkfox.com
 Description:    Avada child theme for Squwakfox
 Author:         Squawkfox
 Template:       Avada
 Version:        1.0.23
*/
 
@import url("../Avada/style.css");
 
/* Theme customization starts here
------------------------------------------------------- */

/*
 * Post heading stylings - override Avada > 'Post Title Typography'
 */

.fusion-blog-shortcode .fusion-blog-layout-grid .fusion-post-content-wrapper {
    padding: 0 !important;
}

/* Headings for medium layouts via shortcode (front page) 
 * Note - no space between classes is intentional; shared on same div
 *        different structure than grid layout! */
.fusion-blog-shortcode.fusion-blog-layout-medium h2 {
    font-size: 1.5em !important;
    margin-bottom: 0.5em;
}

 .fusion-blog-shortcode.fusion-blog-layout-large h2 {
    font-size: 2em !important;
    margin-bottom: 0.5em !important;
}


/* Headings for front-page sections (Hi I'm Kerry, Here are Some Logos, etc... */
.fusion-text h2 {
    font-size: 1.5em !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    margin-top: 0.25em !important;
    margin-bottom: 0.25em !important;
}

.fusion-archive-description {
    margin-bottom: 0 !important; /* Remove lower margin from the category description text which it inherits from .post */
}


 /*
  * Header 
  */


/* 
 * Push content down below header - transparent header otherwise overlaps everything.
 * See Avada -> Options -> Responsive for pixel widths
 */
@media (min-width: 800px) {
    #posts-container, /* Used for blog listing */
    section > article, /* Single article - but NOT post */
    .fusion-archive-description  
    {
        margin-top: 60px !important; /* - don't do this here for #content; it pushes the content that's below the slider image down as well. */
    }

    #sidebar {
        margin-top: 60px !important;
    }
}

@media (max-width: 799px) {
    #posts-container, 
    section > article,
    .fusion-archive-description  
    {
        margin-top: 50px !important; /* - don't do this here for #content; it pushes the content that's below the slider image down as well. */
    }

    /* Override convertplus hacks - push body down below title ONLY if info bar is visible*/
    /* .cp-ib-open #wrapper {
        padding-top: 60px;
    } */

    .fusion-main-menu {
        display: none;  
    }

    .fusion-header {
        padding-top: 10px !important;
    }
}


/* Menu hover */
.fusion-main-menu ul li a:hover {
    text-decoration: underline !important; 
}


/* Dark page -- override menu colors */
.squawkfox-theme-dark .fusion-main-menu ul li a, /* Links in nav menu */
.squawkfox-theme-dark .fusion-flyout-menu-icons .fusion-icon::before /* Search Icon */
{
    color: #fff !important;
}

/* Search Icon, active */
.squawkfox-theme-dark .fusion-flyout-active .fusion-flyout-menu-icons .fusion-icon::before {
    color: #222 !important; 
}


.squawkfox-theme-dark .fusion-flyout-menu ul li a /* Links in flyout */
{
    color: #222 !important; /* Don't override flyout color */
}

/* Hamburger Menu */
.squawkfox-theme-dark .fusion-toggle-icon-line
{
    background-color: #fff !important;
}

/* Hamburger Menu - Active */
.squawkfox-theme-dark .fusion-flyout-active .fusion-toggle-icon-line
{
    background-color: #222 !important;
}


a.squawkfox-logo {
    font-family: Kanit !important;
    font-size: 28px;
    font-weight: 300 !important;
}

.squawkfox-theme-dark a.squawkfox-logo {
    color: #fff;
}

.logo-squawk {
    text-decoration: underline
}

.fusion-main-menu li.menu-item {
    padding-top: 15px;
    padding-bottom: 10px;
}

.fusion-main-menu > ul > li > a {
    font-weight: bold !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    letter-spacing: 0.15rem;
}

.fusion-flyout-menu-item-last {
    padding-bottom: 16px !important;
}



/* Flyout Menu - Overrides */

/* Menu (UL) inside the flyout - general styling for mobile & wide */
.fusion-header-has-flyout-menu .fusion-flyout-menu .fusion-menu,
.fusion-header-has-flyout-menu .fusion-flyout-menu .fusion-mobile-menu 
{
    text-align: left !important;
    margin-top: 60px !important; /* Bind to top, and push down a bit. */
}

/* non-mobile styling */
@media (min-width: 800px) {

    /* Flyout */
    .fusion-header-has-flyout-menu .fusion-flyout-menu-bg {
        width: 400px !important;
        left: auto !important; /* bind to right side */
        border-left: 2px solid #eee;
    }

    /* Menu (UL) inside the flyout - Shrink and bind to right side */
    .fusion-header-has-flyout-menu .fusion-flyout-menu .fusion-menu,
    .fusion-header-has-flyout-menu .fusion-flyout-menu .fusion-mobile-menu 
    {
        width: 400px !important;  /* match flyout width above */
        margin-left: auto !important; /* bind to right side */
        order: 2; 
        padding: 0 25px !important;
    }

    /* Big div that covers the entire UI - need to shrink and bind right so that user can interact with links */
    .fusion-header-has-flyout-menu .fusion-flyout-menu,
    .fusion-header-has-flyout-menu .fusion-flyout-search {
        width: 400px !important; /* match flyout width above */
        left: auto !important; /* bind to right side */
        padding-right: 0 !important;
        padding-left: 0 !important;
    }

    /* Hide top flyout menu items that are mirrored in the horizontal menu when not mobile. */
    .squawkfox-primary-menu {
        display: none !important;
        visibility: hidden !important;
    }
}

.fusion-header-has-flyout-menu .fusion-flyout-menu .fusion-menu li {
    padding: 10px 0 !important;
}

.squawkfox-menu-divider {
    width: 100%;
    padding: 11px 0 0 0 !important;
    margin: 0 0 12px 0 !important;
    border-bottom: 1px solid #222;
}

.fusion-header-has-flyout-menu .fusion-flyout-menu .squawkfox-primary-menu a,
.fusion-header-has-flyout-menu .fusion-flyout-menu .squawkfox-secondary-menu a {
    font-size: 1.5em !important;
    font-weight: 200 !important;
}

.fusion-header-has-flyout-menu .fusion-flyout-menu .squawkfox-tertiary-menu a {
    /* styling for lower "small" font menu in flyout */
}

.fusion-menu-description {
    display: none !important;
}

.menu-item-object-category {
    text-align: left !important;
}

/*
 * Sliders (used on front page, etc.)
 */

/* Anchor image to left side of screen - home page only! */
.home .tfs-slider .background-image,
#fusion-slider-5202 .tfs-slider .background-image, /* About */
#fusion-slider-5214 .tfs-slider .background-image /* Work with kerry */
{
   background-position: 0 0 !important;
}

/* Anchor image to left side of screen - home page only! */
#fusion-slider-5215 .tfs-slider .background-image /* Work with kerry */
{
   background-position: 50% 0 !important;
}


/*
 * As-Seen-On section in front page
 */

.as-seen-on img {
    height: 30px;
    padding: 0 15px;
    margin: 10px 0;
}

.as-seen-on img.bigger {
    height: 45px;
    margin-top: 2px;
}

.as-seen-on p {
    text-align: center;
}

.as-seen-on-carousel img {
    height: 50px !important;
}

/****** sectioned pages ******/
.dark-section {
    border-top: 5px solid #eb2727;
}


/* Make big buttons bigger */
.button-customlarge .button-xlarge {
    font-size: 24px !important;
    line-height: 1.2em !important;
}

/****** Tweaks for GravityForms subscription ******/
/* .squawkfox-subscribe-form is a div wrapping subscribe text plus the actual form shortcode. */
/* It's used in front page, sidebar, and footer. */

.squawkfox-subscribe-form {
    margin: 0; padding: 0;
    text-align: center;
}

/* General */
.squawkfox-subscribe-form img {
    display: inline;
}


/* Form element-specific */

.squawkfox-subscribe-form label {
    display: none;
}

.squawkfox-subscribe-form ul {
    margin: 0 auto;
}

.squawkfox-subscribe-form li {
    float: left;
    width: 47%;
}

.squawkfox-subscribe-form li:first-child {
    margin-right: 5%;
}

/* Text input boxes */
.squawkfox-subscribe-form .ginput_container input {
    height: 43px !important;
    border: 1px solid #999 !important;
    border-radius: 5px !important;
}

.squawkfox-subscribe-form .ginput_container input::placeholder {
    color: #333 !important;
    font-style: italic !important;
}

/* Hide honeypot validation container */
.gform_validation_container {
    display: none !important;
}

/* Subscribe button */
.squawkfox-subscribe-form .gform_footer {
    width: 100%;
    clear: none;
    text-align: left;
}

body .fusion-content-widget-area .button {
    margin-left: 0;
}

/* Small-screen styling */
@media screen and (max-device-width: 480px), (max-width: 480px) {
    .squawkfox-subscribe-form .gform_footer {
        clear: both;
        width: 100%;
    }

    .squawkfox-subscribe-form li {
        float: none;
        clear: both;
        width: 100%;
    }
}


/***** NEW POPUP *****/

.squawkfox-new-popup_wrapper {
    margin-top: 15px !important;
    margin-bottom: 0 !important;
    clear: both !important;
}

.squawkfox-new-popup .button {
    xbackground-color: #222 !important;
    color: #fff !important;
    border-radius: 25px !important;
    font-weight: bold !important;
    font-family:Arial, Helvetica, sans-serif !important;
}

.squawkfox-new-popup .gfield_required {
    display: none !important;
}

.squawkfox-new-popup label {
    font-size: 80% !important;
}

.squawkfox-new-popup .ginput_container input {
    color: #000 !important;
}

.pum * {
    outline: 0 !important;
}

/* Desktop Hacks */
@media (min-width: 800px) {
    .squawkfox-mobile {
        display: none !important;
    }

    .squawkfox-desktop {
        
    }
}

/* Mobile Hacks */
@media (max-width: 799px) {
    .squawkfox-mobile {

    }

    .squawkfox-desktop {
        display: none !important;
    }
}


/***** Custom AWeber Signup Shortcode *****/

.squawkfox-landing {
    margin-top: 20px !important;
}

.squawkfox-landing label {
    display: none;
}

.squawkfox-landing .ginput_container input {
    height: 43px !important;
    border: 1px solid #999 !important;
    border-radius: 3px !important;
}

.squawkfox-landing .ginput_container input::placeholder {
    color: #333 !important;
}

.squawkfox-landing .ginput_container {
    float: left !important;
    margin-bottom: 20px !important;
    margin-right: 15px !important;
    width: 33% !important;
}

.squawkfox-landing .button {
    background-color: #3f92ec !important;
    font-weight: bold !important;
    color: #fff !important;
}

.squawkfox-landing .validation_error {
    color: red !important;
}

/****** Calculators/Tools ******/

.calculator table {
    width: 100%;    
}

.calculator th {
    text-align: left;
    padding-right: 20px;
}

.calculator td {
    padding: 5px 0;
}

.calculator table a {
    text-decoration: underline;
}

.calculator input[type='text'], .calculator select {
    color: #333 !important;
    width: auto !important;
}

.calculator button, .calculator input[type='button'] {
    background-color: #333;
    color: #fff !important;
    font-size: 1em;
    font-weight: bold;
    padding: 5px 8px;
    box-shadow: none;
    cursor: pointer;
    text-transform: uppercase;
}

.calculator p {
    margin: 1em 0;
}


/*
 * Blog Archive and Categories Grid Layout 
 */

/* Structure is:
 * article.fusion-post-grid
 *      .fusion-post-wrapper
 *          .fusion-flexslider (images container)
 *          .fusion-post-content-wrapper
 *              .fusion-post-content
 *                  .squawkfox-categories
 *                  h2.fusion-post-title
 *                  .squawkfox-author
 *                  .fusion-post-content-container
 */

 article.fusion-post-grid {
    padding-bottom: 0 !important;
}

/* Wrap for grid box (whole thing). */
article.fusion-post-grid .fusion-post-wrapper {
    border: none !important;
}

/* Wrap for the images section in grid box. */
article.fusion-post-grid .fusion-flexslider {
    border: none !important;
    border-bottom: 1px solid #ddd !important;
}

article.fusion-post-grid .fusion-post-content {
    display: flex !important;
    flex-direction: column;
}

/* Font-size for titles. Override Avada > 'Post Title Typography' */
article.fusion-post-grid h2 {
    font-size: 1.25em !important;
    font-weight: normal !important;
    margin: 5px 0 !important;
    order: 2 !important; /* Flex reordering */
}

article.fusion-post-grid .fusion-single-line-meta {
    font-size: 0.8em !important;
}

/* Category styling */
article.fusion-post-grid .squawkfox-categories {
    font-size: 0.8em !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    margin: 5px 0 0 0 !important;
    order: 1 !important; /* Flex reordering */
}

article.fusion-post-grid .squawkfox-categories a {
    text-decoration: none !important;
    color: #333 !important;
}

article.fusion-post-grid .squawkfox-categories a {
    text-decoration: none !important;
}

article.fusion-post-grid .squawkfox-categories a:hover {
    text-decoration: underline !important;
}

/* Byline styling */
article.fusion-post-grid .squawkfox-author {
    font-size: 0.8em;
    font-style: normal !important;
    font-family: Taviraj,Times,serif !important;
    margin: 0 0 15px 0 !important;
    order: 3 !important; /* Flex reordering */
}

/* Avada generates this as empty, but it still has volume */
article.fusion-post-grid .fusion-post-content-container {
    display: none !important;
}

/****** Misc tweaks ******/


/*
 * Dropcaps!
 * Usage <span class='sfdropcap'>T</span>his is the beginning...
 */
.sfdropcap {
    font-family: Taviraj;
    font-weight: normal;
    float: left;
    font-size: 4.5em;
    line-height: 1;
    padding: 0.25em 0.4em;
    margin: 0 0.25em 0 0;;
    color: #333;
    background-color: rgb(255, 243, 242);
}



/* Hide dates in sidebar */
.fusion-tabs-widget .fusion-meta {
    display: none;
}

/*
 * Related Posts (below post body) 
 */

/* Hide meta in related posts */
.related-posts .fusion-carousel-meta {
    display: none;
}

/* Decrease font-size for related-posts titles 
 * This is an h4, based off of the in-post h4 styling*/
.related-posts .fusion-carousel-title {
    font-size: 1em !important;
    text-align: center !important;
    font-weight: normal !important;
}

/* 
 * Fix link styling 
 */

.post-content a {
    text-decoration: underline !important;
    color: #246fc8;
}

.post-content a.fusion-button {
    text-decoration: none !important;
}

.post-content a:hover {
    color: #6a71bb;
    text-decoration: none !important;
    transition: all .15s ease-in-out !important;
}

/* Remove underline for links in an H2 (i.e. front page blog boxes, etc. */
.post-content h2 a {
    text-decoration: none !important;
}

/* No underlines in links that are buttons */
.post-content .button-customlarge a,
.post-content .fusion-social-networks a {
    text-decoration: none !important;
}


/* Menu in footer */
footer li.menu-item {
    border: none !important;
    text-transform: uppercase !important;
    text-align: right;
}

footer li.menu-item a:before {
    content: none !important;
}

/* Headings in footer - need to override widget styles */
footer h3 {
    margin-top: 0 !important;
    color: #333 !important;
    font-size: 1em !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    text-align: center !important;
}

footer .textwidget p {
    text-align: center !important;
}

blockquote.squawkstyle {
    display: block;
    border: none;
    border-width: 2px 0;
    border-style: solid;
    border-color: #eee !important;
    padding: 1.5em 0 0.5em;
    margin: 2em 1em;
    padding: 1.25em 0.5em;
    position: relative;
    text-align: center;
    font-size: 1.5em;
    font-style: italic;
    background: none;
}

blockquote.squawkstyle footer {
    font-size: 0.75em;
}

blockquote.squawkstyle:before {
    content: '\201C';
    position: absolute;
    top: -0.25em;
    left: 50%;
    transform: translate(-50%, -00%);
    background: #fff;
    width: 4rem;
    height: 3rem;
    font: 6em/1.08em 'PT Sans', sans-serif;
    color: #666;
    text-align: center;
}

blockquote.squawkstyle:after {
    content: '\201D';
    position: absolute;
    bottom: 0.11em;
    left: 50%;
    transform: translate(-50%, 75%);
    background: #fff;
    width: 4rem;
    height: 4rem;
    font: 6em/1.08em 'PT Sans', sans-serif;
    color: #666;
    text-align: center;
}


/* 
 * Avada 'recent posts' element placed on front page
 * set in Avada under element options > "CSS Class".
 * Wraps entire listing of posts with a single div of this class
 */
.squawkfox-avada-recentposts-element h4 {
    font-size: 2em !important;
    font-weight: 400 !important;
    margin-bottom: 15px !important;
    margin-top: 20px !important;
    line-height: 1.3em;
}

.squawkfox-avada-recentposts-element a {
    color: #222 !important;
    text-decoration: none !important;
}

.squawkfox-avada-recentposts-element a:hover {
    color: #246fc8 !important;
    text-decoration: none !important;
    transition: all .15s ease-in-out !important;
}

.squawkfox-avada-recentposts-element p {
    line-height: 1.75em;
}

.squawkfox-avada-recentposts-element article {
    padding-right: 30px !important;
    margin-bottom: 2em !important;
}