/*
 Theme Name:   Engineering
 Theme URI:    https://lmengineering.bc.ca
 Description:  L&M Engineering Limited
 Author:       Shaun Peterson
 Author URI:   https://cmoit.ca
 Template:     generatepress
 Version:      0.1
*/

#00acf2
#1978FF
#004BB8
#0046AB
#00419E
#003784
#e85555
#d71635
#FF3454
#f8f8fa
*/

/* GeneratePress Site Customization CSS */ /* ## DEFAULTS & OVERRIDES ## */
/* --------------------------------------------- */

/* Frame the whole site with a white border */
@media(min-width:769px) { 
    body {
        border: 20px solid #fff;
        border-top: 5px;
    }
}

/* Subtle fade animation on all hover transitions */
a, img {
    transition: all 200ms linear;
}

/* Specify the weight of strong tag */
strong {
    font-weight: 600;
}


/* ## GENERATEPRESS TWEAKS & OVERRIDES ## */
/* --------------------------------------------- */

/* ### GeneratePress header #### */
/* --------------------------------------------- */

/* Logo width */
.site-logo {
    max-width: 140px
}

@media (min-width:769px) {
    .site-logo img {
        margin-top: 12px
    }
}

/* Stick header logo positioning tweaks */
.main-navigation:not(.sticky-logo) img {
    margin-left: 10px;
    margin-top: -2px
}

.site-logo.sticky-logo {
    margin-top: 8px
}

.site-logo.sticky-logo img {
    height: auto
}

/* GeneratePress header fix for phablets & small tablets
Change the 960px value in two places to where you have nav/logo overlap */
@media (min-width:768px) AND (max-width:960px) {
    .inside-header {
        display: flex;
        flex-flow: row wrap;
        justify-content: center;
        padding: 20px 0 0
    }

    #site-navigation {
        min-width: 768px;
        padding: 10px;
        text-align: center
    }

    #site-navigation ul li {
        display: inline-block;
        float: none
    }
}


/* ### GeneratePress primary nav ### */
/* --------------------------------------------- */

/* Remove the submenu shadow */
.main-navigation ul ul,.secondary-navigation ul ul.sub-menu {
    box-shadow: none
}


/* ### GeneratePress slideout nav #### */
/* --------------------------------------------- */

/* 1px tweak to the navburger toggle icon position */
.menu-toggle:before,.slideout-toggle a::before {
    position: relative;
    top: 1px
}

/* Reduce font size of submenu items */
.slideout-navigation.main-navigation .main-nav ul ul li a {
    font-size: 14px
}


/* ## GENERATEPRESS SIDEBAR WIDGET AREA ## */
/* --------------------------------------------- */

/* Add a little margin bottom to posts in sidebar widgets */
.widget_recent_entries li {
    margin-bottom: 10px;
}

/* Fix inline dates */
.widget_recent_entries span.post-date {
    color: rgba(255,255,255,.6);
    display: block;
    font-size: 14px
}


/* ## GENERATEPRESS FOOTER WIDGET AREA ## */
/* --------------------------------------------- */

/* ### GeneratePress widget layout tweaks & alignments for 3 columns ### */
/* --------------------------------------------- */
.footer-widgets .footer-widget-1 {
    text-align: left
}

.footer-widgets .footer-widget-2 {
    text-align: center
}

.footer-widgets .footer-widget-3 {
    text-align: right
}

@media (min-width:1200px) {
    .footer-widgets .footer-widget-3 {
        padding-left: 100px
    }
}

@media (min-width:768px) AND (max-width:1024px) {
    .footer-widgets .footer-widget-1,.footer-widgets .footer-widget-2,.footer-widgets .footer-widget-3 {
        clear: none!important;
        float: left;
        width: 33.3333%
    }

    .mc4wp-form input {
        width: 100%
    }
}

@media (max-width:768px) {
    .footer-widgets {
        padding: 60px 20px 0
    }

    .footer-widgets * {
        text-align: center
    }

    .footer-widgets .footer-widget-3 p {
        max-width: 400px;
        margin: 0 auto;
        padding-left: 0
    }
}
/* ### GeneratePress widget element tweaks ### */
/* --------------------------------------------- */

/* Specify footer widget line-height */ 
.footer-widgets {
    line-height: 1.7;
}

/* MailChimp 4 WP subscribe form */
.mc4wp-form input {
    margin-top: -1px;
    text-align: center;
    width: 100%
}

.footer-widgets .mc4wp-form input {
    border: 0;
    width: 80%
}


/* ## GENERATEPRESS LOWER FOOTER ## */
/* --------------------------------------------- */

/* Bolt icon color */
.fa-bolt {
    color: #F5AB35;
}


/* ## PLUGINS ## */
/* --------------------------------------------- */

/* ### Gutenberg ### */
/* --------------------------------------------- */

.entry-content section {
    margin-bottom: 1.5em
}

ul.wp-block-gallery {
    margin: 0 0 1.5em
}

/* ### Beaver Builder free edition ### */
/* --------------------------------------------- */

/* Center all editorial text in mobile views ### */
@media (max-width:768px) {
    .fl-html,.fl-rich-text,.pp-infobox-wrap .pp-infobox {
        text-align: center
    }
}

/* Full height banners to take account of the GeneratePress header size */
/* Change the value 110px to the height of your GeneratePress header */
body .fl-row-full-height .fl-row-content-wrap {
    min-height: calc(100vh - 110px)
}

/* A useful text module class make the paragraph text larger */
@media (min-width:768px) {
    .text_large {
        font-size: 130%
    }
}

/* Button style */
.fl-button span {
    font-weight: 700!important
}

/* Mouse scroll icon */
.mouse-scroll>div {
    margin: 15% auto 0;
    position: absolute;
    text-align: center;
    width: 100%
}

.mouse-scroll>div img {
    width: 20px
}

.mouse-scroll>div a:hover {
    opacity: .5
}

/* ### Powerpack lite & UABB lite for Beaver Builder ### */
/* --------------------------------------------- */

/* Add a shadow effect to the Powerpack Infobox module when .shadow class is added to the module */
.shadow .pp-infobox {
    box-shadow: 5px 5px 15px #efefef;
}

/* Typography styles for the UABB & Powerpack button modules */
a.pp-button,a.uabb-button {
    font-family: "Raleway",sans-serif;
    font-weight: 700
}

/* ### Menu Icons ### */
/* --------------------------------------------- */

/* Twitter icon */
#primary-menu a .fa-twitter::before {
    color: #55acee
}

#primary-menu a:hover .fa-twitter::before {
    color: rgba(85,172,238,.75)
}

#primary-menu a .fa-facebook::before {
    color: #3b5999
}

#primary-menu a:hover .fa-facebook::before {
    color: rgba(59,89,153,.75)
}


/* ## SPECIAL EFFECTS ## */
/* --------------------------------------------- */

/* Photo hover shine effect with contrast increase */
@-webkit-keyframes shine {
    to {
        left: 125%
    }
}

@keyframes shine {
    to {
        left: 125%
    }
}

.pp-infobox-image,article.post .post-image {
    margin-bottom: 30px;
    position: relative;
    overflow: hidden
}

.pp-infobox-image::before,article.post .post-image::before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left,rgba(255,255,255,0) 0%,rgba(255,255,255,.3) 100%);
    background: linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg)
}

.pp-infobox-image:hover::before,article.post .post-image:hover::before {
    -webkit-animation: shine .75s;
    animation: shine .75s
}

.pp-infobox-image:hover img,article.post .post-image:hover img {
    -webkit-filter: contrast(125%);
    filter: contrast(125%);
    transition: .3s ease-in-out
}
/* END GeneratePress Site Customization CSS */ /* ## DEFAULTS & OVERRIDES ## */


/* START Disable Secondary Navigation Mobile Menu */
.secondary-navigation .menu-toggle {
    display: none
}

@media (max-width:768px) {
    .secondary-navigation {
        text-align: center!important
    }

    .secondary-navigation ul {
        display: block
    }

    .secondary-navigation .sf-menu>li {
        float: none;
        display: inline-block!important
    }
}
/* END Disable Secondary Navigation Mobile Menu */


/* START Engineering Child Theme Customization CSS */

/* START Fix the mobile breakpoint, mobile navigation bar and text color. */  
@media (max-width:1024px) {
    #site-navigation,#sticky-navigation,.site-header {
        display: none!important;
        opacity: 0
    }

    #mobile-header {
        display: block!important;
        opacity: 1;
        width: 100%!important
    }

    .main-navigation:not(.slideout-navigation) .main-nav>ul {
        display: none
    }

    #mobile-header .menu-toggle,#mobile-header .mobile-bar-items {
        display: block
    }

    .main-navigation {
        background-color: #253f60
    }

    .menu-toggle,.mobile-menu {
        color: #fff!important
    }

    .mobile-header-logo {
        padding-top: 5px
    }
}
/* END Fix the mobile breakpoint, mobile navigation bar and text color. */  

/* Style up the menus a bit */

.main-navigation ul ul {
      width: 350px;
}

.sticky-logo {
    width: 100px;
}

.main-navigation .sub-menu {
    border: 1px solid #eee;
}

.main-navigation .sub-menu > li > a {
}

.main-navigation .sub-menu > li:not(:last-child) > a {
    border-bottom: 1px solid #eee;
}

.secondary-menu {
    padding-top: 20px;
}

.nav-button a:hover {
    border-radius: 4px;
}

.main-navigation {
    border-bottom: 1px solid #ddd;
}

.sticky-enabled .main-navigation.is_stuck {
    box-shadow: none!important;
}

/* END Style up the menus a bit */

.header-box-text {
    text-shadow: 1px 1px rgba(0,0,0,.5)
}

.site-header, #mobile-header {
    background-image: url(/wp-content/uploads/2019/01/banner-diagonal.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.site-description {
    color: #f8f8f8;
    font-size: 1em;
    font-family: "Raleway",sans-serif;
    font-weight: 500;
    font-style: italic;
    float: right;
    margin-top: 25px;
    padding-right: 20px
}

.main-navigation .navigation-logo img {
    padding: 0px !important
}

.widget-area .widget {
    border: solid 1px #eee;
    border-radius: 4px;
}

.wp-post-image .size-auto, .size-full, .size-large, .size-medium, .size-thumbnail  {
    border-radius: 4px;
}


.wp-post-image {
    border-radius: 4px;
}

.engineering-header-box {
    padding: 20px;
    border: solid 1px rgba(37,63,96,0.75);
    background: rgba(37,63,96,0.5);
    border-radius: 5px;
    color: #fff;
    text-shadow: 1px 1px rgba(0,0,0,.5);
}
.engineering-header-box h1,
.engineering-header-box p
 {
    margin: 0px;
}





/* END Engineering Child Theme Customization CSS */ 

/* Engineering Color Pallet
#60A3F9
#5B9BEC
#4271AC
#253f60 /* L&M Logo Color */ 
#2A476D
#1B2E46
#1b4677
#FBFBFB
#EEEEEE
#DDDDDD
#CCCCCC
#00acf2
#1978FF
#004BB8
#0046AB
#00419E
#003784
#e85555
#d71635
#FF3454
#F8F8FA
*/