/*
Theme Name:   sacbikeorg-twentytwenty-child
Description:  Sacramento Area Bicycle Advocates
Author:       Brian Henry
Author URL:   https://BrianHenry.ie
Template:     twentytwenty
Version:      1.0.11
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  sacbikeorg-twentytwenty-child
*/

/* Write here your own personal stylesheet */

/* From old site stylesheet */
.entry-content, .entry-content p {
    font-family:Georgia, "Times New Roman", Times, serif;
    font-size: 15px;
    color: #3f2414;

    line-height: 23px;
    padding-bottom: 12px;
}

.ticss-5d22e3f2 {
    margin-top: 0;
}

/** Add the bike to the left of the header ... probably mess up headers by setting to inline-block */
h1, .heading-size-1 {
    background: url(/wp-content/themes/sacbikeorg-twentytwenty-child/images/bicycle.png) no-repeat bottom left;
    padding-left: 90px;
    display: inline-block;
    border-bottom: 2px solid #9bb8b0;
    padding-right: 15px;
    line-height: 55px;
    color: #3f2414;
    font-size: 4rem;



}



.singular .entry-header {
    padding: 2rem 0;
}

/** 6.4rem originally */
h2, .heading-size-2 {
    font-size: 3rem;
    line-height: 3rem;

    background: url(/wp-content/themes/sacbikeorg-twentytwenty-child/images/bicycle.png) no-repeat bottom left;
    background-size: 42px;
    padding-left: 50px;
}


h3, .heading-size-3 {
    background: url(/wp-content/themes/sacbikeorg-twentytwenty-child/images/bicycle.png) no-repeat bottom left;
    background-size: 40px;
    padding-left: 50px;
    font-size: 2.25rem;
    line-height: 28px;
}


h4, .heading-size-4 {
    font-size: 2.25rem;
    line-height: 2.25rem;
}



@media (max-width:930px) {
    h1, .heading-size-1 {
        border-bottom: none;
        background-size: 42px;
        padding-left: 60px;
        background-position-y: center;
        font-size: 2.5rem;

        line-height: 30px;
    }

    .header-inner {
        padding: 2rem 0;
    }

    .singular .entry-header {
        padding: 1rem 0;
    }

    h2, .heading-size-2 {
        font-size: 2.25rem;
        background-size: 36px;
        background-position-y: center;
    }

    h3, .heading-size-3 {
        font-size: 2rem;
        background-size: 32px;
        background-position-y: center;
    }

    h4, .heading-size-4 {
        font-size: 2rem;
    }
}

.post-inner {
    padding-top: 4rem;
}
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4 {
    margin: 2rem auto 1rem;
}

.site-logo img {
    max-height: 11rem;
}


/** Trying to widen the article width but it resulted in images being cut off and overlaid with text */
/*.entry-content > :not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {*/
/*    max-width: 70rem;*/
/*}*/

/*.entry-content > .alignright, .entry-content > p .alignright, .entry-content > .wp-block-image .alignright {*/
/*    left: calc((100vw - 70rem) / 2 + 70rem + 4rem);*/
/*}*/

/*.entry-content > .alignleft, .entry-content > p .alignleft, .entry-content > .wp-block-image .alignleft {*/
/*    right: calc((100vw - 70rem) / 2 + 70rem + 4rem);*/
/*}*/

/* Added to change menu item colors */
body:not(.overlay-header) .primary-menu > li > a, body:not(.overlay-header) .primary-menu > li > .icon, .modal-menu a, .footer-menu a, .footer-widgets a, #site-footer .wp-block-button.is-style-outline, .wp-block-pullquote::before, .singular:not(.overlay-header) .entry-header a, .archive-header a, .header-footer-group .color-accent, .header-footer-group .color-accent-hover:hover {
    color: #946936;
}

/* Added to change inline anchor color */
.color-accent, .color-accent-hover:hover, .color-accent-hover:focus, :root .has-accent-color, .has-drop-cap:not(:focus)::first-letter, .wp-block-button.is-style-outline, a {
    color: #946936;
}

/* Added to change button color */
button:not(.toggle), .button, .faux-button, .wp-block-button__link, .wp-block-file .wp-block-file__button, input[type="button"], input[type="reset"], input[type="submit"], .bg-accent, .bg-accent-hover:hover, .bg-accent-hover:focus, :root .has-accent-background-color, .comment-reply-link {
    background-color: transparent;
}



/* Adds the bike to the heading */
.bike-h h2, h2.bike-h  {
    width: 100%;
    font-size: 28px;
    color: #3f2414;
    margin-bottom: 25px;
    font-family: 'Roboto', sans-serif;
    background: url(/wp-content/themes/sacbikeorg-twentytwenty-child/images/bicycle.png) no-repeat bottom left;
    padding: 26px 0 0 90px;
    font-weight: 100;
    text-transform: uppercase;
    border-bottom: 2px solid #9bb8b0;
}

/* The tree, bike, Capitol and penny farthing at the top of the footer. */
#footer-top-img {
    height: 75px;
    background: url(/wp-content/themes/sacbikeorg-twentytwenty-child/images/footer_top_img.jpg) repeat-x center bottom;
    background-repeat: no-repeat;
    bottom: 36px;
    position: relative;
    left: 57%;
    width: 400px;
}
@media (max-width:930px) {
    /* Hide it on mobile */
    #footer-top-img {
        display:none;
    }

}

/* Requred to align the top of the heading with the preview image on the homepage */
.entry-content .wp-block-columns h4 {
    margin-top: 0;
}
.entry-content .wp-block-columns h2 {
    margin-top: 0;
}
section {
    padding-top: 0;
    padding-bottom: 0;
}
.wp-block-columns.alignwide + .wp-block-columns.alignwide {
    margin-top:0;
}
/* Flex-posts */
.fp-body h4 {
    margin-bottom:0;
    display: inline;
}
.fp-meta {
    float: right;
}
.fp-excerpt {
    clear:both;
}
.fp-readmore {
    text-align: right;
}

.footer-nav-widgets-wrapper {
    background: url(/wp-content/themes/sacbikeorg-twentytwenty-child/images/footer_bg1.png) repeat-x center bottom;
    background-color: white;
}

.footer-widgets-outer-wrapper {
    border-bottom: none;
}

#site-footer {
    background-color: #9AB8B0;
}

/** Style buttons like the Flex Posts "read more" link */
button {
    text-decoration: none;
    font-size: 0.9em;
    display: inline-block;
    border: 1px solid;
    padding: .2em .7em;
    border-radius: 3px;
    background-color: transparent;
    font-family: Georgia, "Times New Roman", Times, serif;
    color: #946936;
    font-weight: inherit;

}

.footer-top {
    border-bottom: 0;
}

.footer-social a, .social-icons a {

    background-color: #946936;
}

/** These styles initially copied from .powered-by-wordpress but that hides on mobile. */
footer .address {
    color: #6d6d6d;
    display: block;
    margin: 0 0 0 2.4rem;

}

/** Instead of 50%, the homepage logo will be as wide as it needs to be and no wider */
@media (min-width:1000px) {
    .header-titles-wrapper {
        margin-right: 2rem;
        width: 480px;
    }
}

/** Image at top of homepage */
.home .wp-block-image:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.aligncenter) {
    margin-top: 0;
}


@media (min-width:700px) {
    body:not(.singular) main > article:first-of-type {
        padding: 0;
    }

    .entry-header, .archive-header, .singular .entry-header  {
        padding: 0 0 1em 0;
    }

    .header-inner {
        padding-bottom: 1.5em;
    }
}

.category .entry-content > :not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
    max-width: 75rem;
}

.widget-title a {
    text-decoration: none;
    color: unset;
}
.widget-title a:hover {
    text-decoration: underline;
}

.footer-widgets-outer-wrapper {
    padding: 0 0 3.5rem;
}

#footer-login {
    text-decoration: none;
    color: #6d6d6d;
    min-width: 50px;
}

@media ( max-width: 479px ) {
    #site-footer .section-inner {
        display: block;
    }

    .footer-copyright {
        margin-bottom:5px;
    }

    footer .address {
        margin:5px 0;
    }

    #footer-login {
        display:block;
        text-align:center;
    }
}



.subtitle-button {
    border: 1px solid #9bb8b0;
    border-radius: 3px;
    padding: 10px;
    margin-bottom: 10px;
    max-width: 400px;
}

.footer-widgets  .subtitle-button {
    max-width: 300px;
}


.subtitle-button .subtitle-button-section {
    display: inline-block;
    min-height: 37px;

}

.subtitle-button .subtitle-button-section-left {
    max-width: calc(100% - 50px);
}

.subtitle-button .subtitle-button-section-right {
    display: contents;
    float: right;
    margin-top: 15px;
}

.subtitle-button .subtitle-button a, .subtitle-button a:hover {
    text-decoration: none;
    color: #3f2414;
}

.subtitle-button .title {
    line-height: 37px;
    text-transform: uppercase;
    color: #3f2414;
    font-size: 1.5em;
    font-weight: normal;
    font-family: 'Roboto', sans-serif;
}

.subtitle-button .subtitle {
    color: white;
}

.subtitle-button .arrow {
    float: right;
}

.fp-post .fp-title {
    line-height: 1.2;
}

time {
    min-width: 120px;
}

h2 a {
    color: unset;
    text-decoration: none;
}

h2 a:hover {
    text-decoration: underline;
}

h2 {
    word-break: keep-all;
}




.header-navigation-wrapper {
    display: inline-block;
}

.new-header-navigation-wrapper {
    display:flex;
}

.header-meta {
    text-align: center;
    margin-right: 0px;
}
.header-meta a {
    color: #929292;
    text-decoration: none;
}
.header-meta a:hover {
    text-decoration: underline;
}
.header-social a {
    color:white;
}

@media (min-width:1000px) {

    .header-meta {
        text-align:right;
        margin-right: 80px;
    }
}

@media (min-width:1220px) {

    .header-meta {
        margin-right: 100px;
    }
}

@media (max-width:1000px) {
    .header-navigation-wrapper {
        width: 100%;
    }
    .hide-below-1000 {
        display: none;
    }
}

.header-social-wrapper {
    color: white;
}

ul.header-social {
    width: max-content;
    position: unset;
    float: right;

}

/* 1290 is the point where the address is too wide and begins to wrap */
@media (max-width:1290px) {
    .hide-below-1290 {
        display: none;
    }
    .block-below-1290 {
        display: block;
    }
}

.entry-date.published  {
    white-space:nowrap;
}

/* For whatever reason, the search button was transparent */
input[type="submit"].search-submit {
    background-color: #8e6a3f;
}

.search404link {
    color: #946936;
    font-weight: normal;
    display: block;
    font-size: 1.7rem;
    padding-top: 5px;
}



.wp-block-button.bh-readmore {
    display: block;
    text-align: right;
    margin-right: 0;
}

.bh-readmore a:hover {
    color: rgb(148, 105, 54);
}

.bh-readmore a {
    border-color: rgb(148, 105, 54);
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;

    box-sizing: border-box;
    color: rgb(148, 105, 54);
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 13.5px;
    letter-spacing: normal;
    line-height: 23px;

    text-align: center;

    text-decoration: rgb(148, 105, 54);
    text-decoration-line: none;
    text-decoration-style: solid;

    transition-delay: 0s;
    transition-duration: 0.15s;
    transition-property: all;
    transition-timing-function: linear;

    font-weight: 400;
    padding: .2em .7em;
}
.is-style-outline .wp-block-button__link {
    padding: .2em .7em;
}

.wp-block-button.is-style-outline .wp-block-button__link, .is-style-outline .wp-block-button__link {
    border: 1px solid;
    border-radius: 3px !important;
}


/* white space above ALL POSTS button */
.ticss-fde3edd4:first-child {
    margin-top: 0;
}