/*
Theme Name:         nhc
Theme URI:          https://github.com/postlight/nhc/tree/master/wordpress/wp-content/themes/nhc
Description:        Custom theme for nationalhumanitiescenter.org.
Version:            9.0.9
Author:             Postlight
Author URI:         https://postlight.com
Text Domain:        sage

License:            MIT License
License URI:        http://opensource.org/licenses/MIT
*/

/* NHC Custom Styles Fall 2019 */

/* TYPOGRAPHY */
/* previous sans-serif did not include double quotes */
@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i&display=swap&subset=latin-ext');

body, p, .archive-item-content p {font-family: 'Roboto', sans-serif; font-size: 1.06rem; line-height: 1.65rem;}
.single-post .entry-title {margin-bottom: 3rem;}
h1 {font-size: 2.9rem;}
h2, h3 {font-family: 'Roboto', sans-serif; margin: 1.5rem 0 .75rem;}
h2 {font-size: 2rem;}
h2.archive-title {font-size: 3rem;}
.archive-item-content h2 {font-family: 'Roboto', sans-serif; margin-top: 0;}
.home .banner-content h2 {font-size: 1.6rem; line-height:1.2em;}
.home .banner-content p {font-size: 1.1rem;}
.one_half.invert h3 {margin-top: .3em;}
h4 {font-family: 'Roboto', sans-serif; line-height: 1.9rem;}
h4.intro {color: #4f758b; margin-bottom: 30px;}
h5 {font-family: 'Roboto', sans-serif; font-size: 1.2rem;}
blockquote {color: #888;}
p.indent {padding-left: 40px;}
.smalltype {font-size: .9rem; line-height: 1.4rem;}
a.button {text-transform: uppercase;}
.fellow-year {font-size: .75em; line-height: 1.6em; font-weight: normal; color: white; background: #4f758b; padding: 0px 6px; display: inline-block;}
header.banner .nav-primary .nav {font-size:1rem;} /* side nav font size adjusted for HICDL */
.project-2-title {font-size:1.3rem; margin-bottom:5px;}
.fellow-image-caption {font-size: .8rem; font-style: italic; margin: 5px 0 0 0;}
input[type=password], input[type=submit] {padding:10px; outline: 1px solid #4f758b;}

/* lists */
main ul:not(.list-none):not(.slides):not([class^=books]):not([class^=fellows]):not(.glide__captions) li {padding-left: 0; font-size: 1.06rem;}
ul.smalltype li {font-size: .95rem; line-height: 1.3rem;}
.content ol {list-style-type: decimal; padding-left: 1.2rem; margin: 20px 0;}
.content ul, .content ol {margin-bottom: 1.5rem;}
ul.no-dot {list-style-type: none !important; margin-left: 0 !important; padding-right: 10px;}
.sticky-alphabet .content li {line-height: 1.1rem;}

/* category and templates */
.archive .meta, .recent-posts-content .meta {font-size: 1rem;}
.category-coming-events .meta, .category-on-exhibit .meta {display: none;}
.template-become-a-fellow .entry-title {line-height: 4rem;}
.template-become-a-fellow .intro h2 {font-size: 1.6rem; line-height: 2rem; color: #888; margin: 0 0 30px 0;}
.template-explore .feature h4 {font-size: 1.3rem; line-height: 1.8rem;}
.template-explore .feature p {font-size: 1rem !important; line-height: 1.5rem;}

/* LAYOUT */
.hide {display: none;}
br {margin-bottom: .5rem;}
.homepage-header {margin: 0 auto 47px; padding-top: 30px;}
.homepage-banner .banner-content {width:350px;} /* trying to fit National Humanities on one line */
header.invert {padding: 90px 100px;}
.template-invert-header .intro-photo {float: right; margin: -80px 0px 28px 28px;}
.profile-container {padding-bottom: 50px;}
.fellow-image {margin-top: -140px;}
.fellow-data br.m-0 {display: none;}
.fellow-data a.button.m-0 {margin-right: 20px !important;}
.archive .archive-image {margin-right: 30px;}
.author-bio {clear: right;}
.fellow-bio img.book-cover, .author-bio .wp-caption  {max-width: 27%; margin-left: 30px;}
.button-inline {padding: .5rem; margin: .5rem .5rem 0.1rem 0;}
img.bio-thumb {float: right; margin: 0 0 5px 20px; width: 43%;} /* mostly Education projects */
.responsive-embed.video {margin: 2rem 0;}
p:empty:before {content:none !important;} /* remove the empty space above line breaks */

/* post with hero image */
.entry-hero+.content-wrap {border-top: 0;}
.single-post .entry-hero {height: 400px; overflow: hidden; margin-bottom: -130px;}
.entry-hero img {margin-top: -7%} /* default positioning, can be overridden per post */

/* 4-up card grid */
ul.card-holder {display: flex; flex-wrap: wrap; justify-content: space-around; list-style-image: none; margin-left: 0 !important; clear: right;}
ul.card-holder li {list-style-type: none; padding-top: 0 !important; flex-basis: 23%; text-align: center; background-color: #dce2e6; margin-bottom: 2%}
ul.card-holder li img {width: 100%;}
ul.card-holder li h4, ul.card-holder li p {line-height: 1.3em; padding: 0 5%}
ul.card-holder li h4 {font-size: .9em; margin: 10px 0;}
ul.card-holder li p {font-size: .75em; margin: 0;}

/* item boxes (webinars, courses, events, etc) */
.item-box {clear: both; border-top: 2px solid #4f758b; padding: 20px 0;}
.item-box .bio-photo {width: 30%;}

/* Fellows book page and webinar page*/
.single-fellows_book img.wp-post-image, .single-education_material img.wp-post-image {float:right; margin-left:2%; max-width:36%;}

/* COLORS */
a {padding: 0; background-color: transparent; color: #4f758b; font-weight: bold; text-decoration-color: #88adc3;}
a.button, .homepage-link, .ais-infinite-hits--showmore button, .search-new, .search-container .button-container .search-btn.active {background-color: #4f758b; color: white; border: 2px solid #276990;}
a:hover,.sticky-alphabet .letters li.active {background: #b9e5ff;}
a.button:hover, .homepage-link:hover, .ais-infinite-hits--showmore button:hover, .search-new:hover {background-color: #106fa7; border-color: #b9e5ff;}
.invert a, .text-white a, .callout a {color: white; text-decoration-color: white;}
.search-container.active .search-filter-container .filter span:after, .search-container.compact .search-filter-container .filter span:after, .search-container .search-filter-container .filter span:after {border-color: #4f758b;}
.home .banner-content a {text-decoration: none;}
.home .banner-content.active a {background-color: #4f758b; color: white;}
.item-categories .category {border-color: #88adc3;}
hr {border-color: #4f758b;}

/* LEGACY SHORTCODES */
main .t4p-recent-posts .floated-slideshow {float: left; width: 200px; margin: 0 20px 20px 0;}
main .t4p-recent-posts .recent-posts-content {min-height: 215px; margin-bottom: 3em;}
main .t4p-reading-box-container .reading-box {min-height: 440px; border-bottom: 3px solid #4f758b !important;}
main .t4p-reading-box-container .reading-box a.btn {float: right; margin: 1.5rem;}
main .t4p-reading-box-container h2 {font-size: 1.7rem; line-height: 2.3rem;}
main .t4p-reading-box-container p {font-size: 1.1rem; clear: right;}
main .t4p-reading-box-container .bio-photo {width: 20%; clear: right; margin: 2rem;}
main .t4p-reading-box-container .partner-logo {height: 118px;}
main .t4p-reading-box-container [type=button] {-webkit-appearance: initial;}
main .t4p-reading-box-container.full a.btn {background-color: #888; border: 0;}

/* RESPONSIVE */
@media (max-width: 1024px) {
	.single-fellow .fellow-bio {font-weight: 400;}
	.single-fellow .fellow-image {margin-top: -50px;}
	.single-fellow .fellowship {margin-bottom: 0;}
	.single-fellow .profile-container {padding-bottom: 0;}
}
@media (max-width: 768px) {
	header.invert {padding: 30px;}
	h1 {padding-right: 0;}
	ul#card-holder li {flex-basis: 32%}
	ul#card-holder li h4 {font-size: initial !important;}
	.template-invert-header .intro-photo {float: initial; margin: initial;}
	p {font-size: initial;}
	h4.intro {font-size: 1.4rem;}
	.single-post .entry-hero {height: initial; margin-bottom: -40px;}
	.item-box .bio-photo {width: 70%; margin: 0 auto;}
	.one_half, .one_half ul, .one_third, .one_third ul {margin-bottom: 0;}
}
@media (max-width: 571px) {
    ul.card-holder li {flex-basis: 48%;}
}
@media (min-width: 1024px) {
    #menu-item-18703 .sub-menu-wrap {margin-top: -288px} /* become a fellow menu */
	body main li {font-size: 1rem;}
	.homepage-banner .banner-content {width: 333px;}
}

/* homepage pillar boxes with news items */
.homepage-body .body-container {margin-bottom:50px;}
.homepage-body .body-content {padding:40px;}
.homepage-body .body-content hr {border-bottom: 3px solid #eee9e9; margin:35px 0;}
.homepage-body .body-content p {font-size:16px; line-height:1.4em; margin-bottom:0;}

/* Styles is what I have */
/* .banner-content h2, .banner-content p {text-shadow: 1px 1px 2px grey;} */
/* .text-white {text-shadow: 1px 1px 2px grey;} */
/* .invert {background-color: #4f758b;} */
/* header.banner .nav-primary {background-color: #4f758b;} */
/* header.banner a {background-color: transparent;} */
/* .template-explore .feature a {line-height: initial;} */
/* .mask-30 img {opacity: initial;} */
/* .hero.mask-30 img {opacity: .7;} */
/* header.topborder {border-top-color: #bbb;} */
/* body, p {font-size: 1.2rem; line-height: 1.6rem; letter-spacing: -0.02em;} */