/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/

/* Typography
---------------------------------------------------------------------------------------------------- */

html {
    font-size: 10px;
}

body.bb-custom-typo {
    font-family: 'soleil', sans-serif;
    font-weight: 300;
    font-size: 1.6rem;
    line-height: 1.7;
    color: #505050;
}

.bb-custom-typo h1{
    font-family: 'futura-pt', sans-serif;
    font-size: 5rem;
    font-weight: 300;
    line-height: 1.3;
}
.bb-custom-typo h2 {
    font-family: 'futura-pt', sans-serif;
    font-size: 3rem;
    font-weight: 400;
    line-height: 1.3;
}

.bb-custom-typo h3,
.bb-custom-typo h4,
.bb-custom-typo h5,
.bb-custom-typo h6 {
   font-family: soleil, sans-serif; 
}

a,
a:hover {
    color: var(--bb-body-text-color);
}



/* Layout
---------------------------------------------------------------------------------------------------- */

/* Headings
--------------------------------------------- */

.site-header .site-title img {
	padding: 10px;
}

.single .entry-title {
    font-size: 5rem;
    letter-spacing: normal;
    line-height: 1.2;
}

.single .entry-meta {
    margin-bottom: 40px;
}

/* Menus
--------------------------------------------- */

.bb-mobile-panel-inner .bb-primary-menu .current-menu-item > a,
.primary-menu .current_page_item > a {
    color: var(--bb-headings-color);
    font-weight: 300;
} 

.primary-menu > li > a,
a.user-link {
    font-size: 1.6rem;
    font-weight: 300;
}

/* Front Page
--------------------------------------------- */

.site-header .container {
	max-width: unset;
}

.home-page .city-masthead {
    margin: 0 auto;
    padding: 20px 0;    
}

.home-page .city-masthead .wp-block-image {
    margin-bottom: 12px;
}

.home-page .city-masthead img {
    max-width: 300px;
}

.home-page .tagline {
    font-family: 'futura-pt', sans-serif;
    font-size: 2.8rem;
    font-weight: 300;
    line-height: 1.3;
}

.site-content .container {
    max-width: 1200px;
    padding: 0 20px;
}

.home-page .feature,
.home-page .feature-one-two {
    display: flex;
}

.home-page .feature-three {
    flex-basis: 26%;
}

.home-page .feature-one-two {
    flex-basis: 74%;
}

.home-page .feature-one {
    flex-basis: 64%;
}

.home-page .feature-two {
    flex-basis: 36%;
}

.home-page .feature article {
    padding: 4px;
}

.feature-one .entry-content-wrap {
    font-size: 1.6rem;
    line-height: normal;
    padding: 20px;
}

.feature-one .entry-title {
    font-size: 2.8rem;
/*    font-weight: 300;*/
}

.feature-one .entry-content {
    margin-bottom: 20px;
}

.feature-two .post-inner-wrap {
    display: flex;
}

.feature-two .entry-img {
    padding: 0;
}

.feature-two .entry-img img {
    position: unset;
    aspect-ratio: 40 / 60;
}

.feature-two .ratio-wrap {
    flex-basis: 40%;
}

.feature-two .entry-content-wrap {
    font-size: 1.5rem;
    line-height: normal;
    padding: 20px;
    flex: 1;
}

.feature-two .entry-header,
.feature-three .entry-header {
    margin-bottom: 10px;
}
.feature-two .entry-title {
    font-size: 2rem;
/*    font-weight: 300;*/
}

/*.feature-two .entry-content,*/
.feature-two .entry-meta,
/*.feature-three .entry-content,*/
.feature-three .entry-meta {
    display: none;
}

.feature-three .entry-content-wrap {
    font-size: 1.5rem;
    line-height: normal;
    padding: 20px;
}

.feature-three .entry-title {
    font-size: 2.2rem;
/*    font-weight: 300;*/
}

.post-author, 
.post-date {
    font-size: 1.3rem;
}

/* Pages
--------------------------------------------- */

.page-text .site-content .container {
    max-width: 800px;
}

.page-text .entry-content {
    font-family: 'brando', serif;
    font-size: 2rem;
    margin-bottom: 60px;
}

.page .wp-block-image {
    margin-bottom: 40px;
}

.page .bb-subscribe-wrap {
    margin-top: 40px;
}


/* Blog
--------------------------------------------- */

.single .entry-content {
    font-family: 'brando', serif;
    font-size: 2rem;
    margin-bottom: 60px;
}

.single .entry-img {
    margin-bottom: 10px;
}

.single .entry-content p a {
    border-bottom: 1px dotted;
}

.single-post .post-related-posts > h3,
.single-post .comments-area h4 {
    font-size: 2rem;
}

.single-post.full-fi-invert .content-area .post-related-posts header.entry-header {
    margin-top: 0;
}

.single-post .post-related-posts h2.entry-title {
    font-size: 2.4rem;
}

.post-related-posts .entry-content {
    font-family: 'soleil', sans-serif;
    font-size: 1.6rem;
}

.post-author-details .avatar {
    max-width: 80px;
    margin-right: 10px;
}

.post-author-details .author-desc {
    font-size: 1.6rem;
    color: var(--bb-body-text-color);
    margin-top: 10px;
}

.bb-subscribe-wrap {
    font-size: 1.7rem;
    color: #fff;
/*    background-color: #5d5d5d;*/
/*    background-color: #004172;*/
    background-color: var(--bb-primary-color);
}

.bb-subscribe-wrap p {
    font-family: 'soleil', sans-serif;
    font-size: 1.7rem;
    color: #fff;
}

.bb-subscribe-wrap h3 {
    font-size: 3rem;
    color: #fff;
    margin-bottom: 34px;
}

.bb-subscribe-wrap .invitation {
    margin: 10px 0 40px;
}

.bb-subscribe-wrap .button,
.bb-subscribe-wrap .wp-block-buttons > .wp-block-button.has-custom-font-size .wp-block-button__link {
    font-family: 'soleil', sans-serif;
    font-size: 1.6rem;
    background-color: #fff;
    border: #fff;

}

/* Social
--------------------------------------------- */

.ns-inline, .ns-inline-cta {
    margin-bottom: 20px;
}

.ns-inline-below {
    margin-top: 40px;
}

/*
Media Queries
----------------------------------------------------------------------------------------------------*/


/* Target iPhone Pro Max (430x932)
------------------------------------------------------------- */

@media only screen and (max-width: 599px) {

    /* Front Page
    --------------------------------------------- */

    .site-content .container {
        padding: 0;
    }

    /* Front Page
    --------------------------------------------- */

    .home-page .city-masthead {
        margin: 0 auto;
        padding: 10px 0;    
    }

    .home-page .city-masthead .wp-block-image {
        margin-bottom: 6px;
    }

    .home-page .city-masthead img {
        max-width: 240px;
    }

    .home-page .tagline {
        font-family: 'futura-pt', sans-serif;
        font-size: 2.4rem;
        font-weight: 300;
        line-height: 1.3;
    }

    .home-page .feature {
        flex-direction: column-reverse;
    }

    .home-page .feature-one-two {
        flex-direction: column;
    }

    /* Front Page
    --------------------------------------------- */

    .post-author-details {
        flex-direction: column;
    }

    .post-author-details .avatar {
        margin: 0 0 10px 10px;
    }

}
