/*
Theme Name: Meet and Read
Description: Custom Theme for Meet and Read
Author: Meet and Read
Template: really-simple
Version: 1.0
*/

/* ==========================================================================
   Base Styles
   ========================================================================== */

body {
    background-color: #EEEEEE;
}

/* Links */
a, 
a:visited, 
a:hover, 
a:focus, 
a:active {
    color: #B31B1B;
}

/* Utility Classes */
.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

/* ==========================================================================
   Header & Masthead
   ========================================================================== */

#masthead {
    max-width: 1180px;
    margin: 0 auto;
    background-color: #E9BE7C;
    border-bottom: 40px solid #195E12;
    padding: 0 !important;
}

.site-branding {
    padding: 0 !important;
    margin-bottom: 0 !important;
}

.site-header {
    flex-flow: column nowrap;
}

.site-header .site-title,
.site-header .site-branding {
    margin: 0 auto 10px auto;
}

#wp-admin-bar-really-simple-admin-bar {
    display: none !important;
}

/* ==========================================================================
   Main Content Area
   ========================================================================== */

#primary {
    background-color: #E9BE7C;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 1rem;
    min-height: 100vh !important;
}

/* Content Backgrounds */
.post-card, 
.entry-header, 
.entry-body, 
.entry-content, 
.entry-meta,
.navigation .nav-links .nav-previous a, 
.navigation .nav-links .nav-next a {
    background-color: #F8ECD8 !important;
}

.home .really-thumb {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}

.post-card .card-body .entry-content p {
    font-size: 1rem !important;
}

/* ==========================================================================
   Post Cards
   ========================================================================== */

.post-card {
    margin-top: 1rem !important;
}

.post-card:first-of-type {
    margin-top: 0 !important;
}

.post-card .card-media {
    align-self: center !important;
    min-width: 270px !important;
    max-width: 270px !important;
}

.post-card .card-media .really-thumb {
    border-radius: 3px 0 0 3px;
    min-width: 270px !important;
    border: 4px solid #195E12;
}

.post-card .card-body {
    padding: 35px 20px 12px 20px !important;
}

/* ==========================================================================
   Single Post & Page Styles
   ========================================================================== */

.single-post .really-single-thumb, 
.page .really-single-thumb {
    float: left;
    width: 270px;
    height: auto;
    margin: 0 1rem 1rem 0;
    display: block;
    border: 4px solid #195E12;
}

.really-single-thumb + p, 
.really-page-thumb + p {
    margin-top: 0 !important;
}

.single-post .entry-header, 
.page .entry-header {
    padding-bottom: 1rem !important;
}

.page .entry-body, 
.page-template .page .entry-body {
    border: none !important;
    padding-top: 0;
}

/* ==========================================================================
   Sidebar & Widgets
   ========================================================================== */

.widget-area .widget {
    background-color: #CBE4B9;
}

.widget-area .widget ul, 
.widget-area .widget ol {
    list-style: none;
    padding-left: 0;
}

.widget li {
    padding-bottom: 1rem;
}

.widget a,
.widget a:visited {
    color: #000 !important;
    display: inline-block;
}

.nav-links a, 
.nav-links a:visited {
    color: #000 !important;
}

/* ==========================================================================
   Link Hover States
   ========================================================================== */

.entry-content a:hover, 
.entry-content a:focus, 
.entry-content a:active {
    color: #B31B1B !important;
}

.widget-area a:hover, 
.widget-area a:focus, 
.widget-area a:active,
.entry-title a:hover, 
.entry-title a:focus, 
.entry-title a:active,
.really-first-menu a:hover, 
.really-first-menu a:focus, 
.really-first-menu a:active {
    color: #000 !important;
}

.entry-title a {
    display: inline-block;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */

/* Mobile Styles (max-width: 820px) */
@media only screen and (max-width: 820px) {
    .home .post.has-post-thumbnail {
        padding-top: 1rem;
    }

    .home .card-body {
        padding-top: 12px !important;
    }

    #primary {
        max-width: 400px;
    }

    .navigation .nav-links .nav-previous a,
    .navigation .nav-links .nav-next a {
        padding: 10px;
    }

    .entry-site-main {
        min-width: 100% !important;
        max-width: 100% !important;
    }

    .post-card {
        border-radius: 0;
        flex-flow: column nowrap;
    }

    .post-card .card-body time {
        display: none;
    }

    .post-card .card-media {
        min-width: 100% !important;
        max-width: 100% !important;
    }

    .post-card .card-media .really-thumb {
        border-radius: 0;
        margin: 0 auto;
    }

    .really-single-thumb {
        float: none !important;
        margin: 0 auto !important;
    }

    .single .really-single-thumb {
        margin-bottom: 1rem !important;
    }
}

/* Tablet Styles (min-width: 821px) */
@media only screen and (min-width: 821px) {
    .home .post.has-post-thumbnail {
        padding-left: 1rem;
    }
}

/* Desktop Styles (min-width: 1200px) */
@media only screen and (min-width: 1200px) {
    #primary {
        padding-left: 1rem;
    }
}