/*
 Theme Name:   Prevention
 Theme URI:    https://northernbccrisissuicide.ca
 Description:  Crisis prevention, intervention and information centre for Northern BC
 Author:       Shaun Peterson
 Author URI:   https://cmoit.ca
 Template:     generatepress
 Version:      0.1
*/

/* GeneratePress Site CSS */

/* CCNBC Color Pallet
#3faedc
#0193cf
#00acf2
#e85555
#e83535
#ffffff
#f8f8fa
#111111
*/

/* ## 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 */

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

@media (max-width: 768px) {
    .mobile-header-navigation .site-logo.mobile-header-logo img {
        max-width: 180px;
        height: auto;
        margin-top: 15px;
    }
}

/* 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 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 */

.slideout-toggle a::before,
.menu-toggle: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, 0.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: 50px 20px 50 20px;
    }
    .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: none;
    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 0;
}

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

/* --------------------------------------------- */

/* Center all editorial text in mobile views ### */

@media(max-width:768px) {
    .pp-infobox-wrap .pp-infobox,
    .fl-rich-text,
    .fl-html {
        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: 5% auto 0 auto;
    position: absolute;
    text-align: center;
    width: 100%;
}

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

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

/* Beaver Builder logo graphic size */

.builder-graphic img {
    max-width: 100px;
}

/* ### 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.uabb-button,
a.pp-button {
    font-family: "Raleway", sans-serif;
    font-weight: 700;
}

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

/* --------------------------------------------- */

/* Twitter icon */

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

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

/* Facebook icon */

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

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

/* ### Contact Form 7 ### */

/* --------------------------------------------- */

/* Border radius on submit button */

input.wpcf7-submit {
    border-radius: 5px;
}


/* ## SPECIAL EFFECTS ## */

/* --------------------------------------------- */

/* Photo hover shine effect with contrast increase */

.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;
}

@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}

@keyframes shine {
    100% {
        left: 125%;
    }
}

/* End GeneratePress CSS Customization */

/* 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;
    }
}

/* Page header text shadow */
.text_larger {
    text-shadow: 1px 1px rgba(0, 0, 0, .25);
}

.crisis-header-content-box {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;

    background-color: rgba(0,172,242,0.25);
    border-style: solid;
    border-width: 0;
    background-clip: padding-box;
    border-color: rgba(0,172,242,0.5);
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;

    text-shadow: 1px 1px rgba(0, 0, 0, .25);

    padding-top: 25px;
}

@media(min-width:768px) {
    .text_larger {
        font-size: 130%;
    }
}

ul.ccnbc-list {
  list-style-type: none;
  margin: 0 0 1.5em 1.5em;
}

.ccnbc-list li {
  position: relative;
  padding-left: 25px;
  margin-bottom: 0px
}

.ccnbc-list li:before {
  position: absolute;
  top: 0;
  left: 0;
  font-family: FontAwesome;
  content: "\f105";
  color: #0193cf;
}

@media(min-width:768px) {
    .copyright-bar {
        margin-top: 20px;
    }
}

.main-navigation.navigation-stick .main-nav ul li a, 
.navigation-stick .menu-toggle {
    font-size: .7em;
}

@media(max-width:815px) {
    .main-navigation .main-nav ul li a, .main-navigation .mobile-bar-items a, .menu-toggle {
        padding-right: 5px;
    }
}

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

.generate-back-to-top,
.generate-back-to-top:visited {
    bottom: 20px; /* 10px from the bottom of your screen */
    left: 20px; /* 10px from the left of your screen */
}