/*
 Theme Name:   Hestia - Parts Not Included
 Description:  Hestia Child Theme for Parts Not Included
 Author:       David Madison
 Author URI:   http://www.partsnotincluded.com
 Template:     hestia
 File:         style.css
 Version:      1.0.0
*/

@import url("../hestia/style.css");

/*
 * ##############################################
 * #                   Layout                   #
 * ##############################################
 */

 /* Heavier body font weight, for "Raleway" font */
 body {
	font-weight: 400;
 }

/* Wider posts and static pages (80%, default 67%) */
@media (min-width: 992px) {
	.single-post article .col-md-offset-2, .page-template-default:not(.home) article .col-md-offset-2 {
		margin-left: calc((100% - 80%) / 2);
	}
	.single-post article .col-md-offset-2, .page-template-default:not(.home) article .col-md-8 {
		width: 80%;
	}
}

@media (max-width: 768px) {
	/* Full-width excerpts on archive pages at small widths */
	.archive .col-ms-5, .archive .col-ms-7 {
		width: 100%;
	}
}

@media (max-width: 511px) {
	/* Fix comments stretching the page width on mobile */
	.comment .media-body {
		display: inline;
		overflow: hidden;
	}

	.single-post .comment h4.media-heading {
		margin-bottom: 30px;
	}
}

/* Remove red code tag color, match color of normal text */
code {
	color:rgb(60, 72, 88);
	background-color:#f0f0f0;
}

/* Reduce distance between header and post text */
.single .post .main .section {
	padding-top: 40px;
}

/* Center block quotes in entry content */
.entry-content blockquote {
	display: table;
	float: none;
	clear: both;
	position: relative;
	width: auto;
	margin: 0 auto 20px auto;
}

/* Reduce bottom margin for lists (default 30px) */
ul, ol {
	margin-bottom: 15px;
}


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

 /* hide white logo on 'transparent' mobile menu, show regular one instead */
@media (max-width: 768px) {
	.navbar.navbar-transparent .hestia-hide-if-transparent {
		display: block;
	}

	.navbar-transparent .navbar-header .hestia-transparent-logo { 
		display: none;
	}
}

/* Fit all menu items in a line when window is resized */
@media (max-width: 991px) {
	#main-navigation ul.nav > li {
		margin: 0;
	}
}

/* Center arrow in "scroll to top" box (now SVG not FA for 3.0+) */
.hestia-scroll-to-top {
	font-size: 25px;
}

/* Fix menu search margin on 404 page */
.error404 .hestia-search-in-menu .search-form {
	margin-top: 0;
}


/*
 * ##############################################
 * #                   Header                   #
 * ##############################################
 */

 /* Set header heights */
#primary.page-header > .container {
	height: 368px;  /* default, as set with padding */
}

.single #primary.page-header > .container {
	height: 520px;
}

/* Align header image vertically, accounting for menu height */
#primary.page-header .header-filter {
	background-position: center calc(50% + 35px);
}

/* Animate header meta on page load */
.single #primary.page-header .container .row .col-md-10 {
	animation: .7s 0.15s header-title both;
}

@keyframes header-title {
	from { transform: translateY(520px); }
	to { transform: initial; }
}

@-webkit-keyframes header-title {
	from { transform: translateY(520px); }
	to { transform: initial; }
}

/* Center header img 'dummy' on front page big title (why not?) */
.carousel .header-image-container {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

/* Hide header img 'dummy' loader */
.header-image-container > img {
	display: none;
	width: inherit;
	max-width: 100%;
	margin: 0 auto;
}

/* Fix header meta alignment weirdness... */
#primary.page-header .container {
	padding-top: 70px !important;  /* menu height */
	padding-bottom: 0;
}

#primary.page-header .container > .row {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

#primary.page-header .col-md-10.text-center {
	display: table;
	width: auto;
	margin: auto;
	float: none;
}

/* Put background behind post title instead of whole header */
/* Also limit max width */
.single .post #primary .col-md-10.text-center {
	background-color: rgba(0,0,0,0.6);
	border-radius: 15px;
	max-width: 85%;
	box-sizing: content-box;
}

.single .post #primary .header-filter:before {
	background-color: transparent;
}

@media (max-width: 768px) {
	/* Don't reduce header font size for mobile */
	.page-header.header-small .hestia-title, .page-header.header-small .title  {
		font-size: 36px !important;
	}

	/* Don't remove header title top margin for mobile */
	.single-post .page-header.header-small .container .hestia-title {
		margin-top: 20px;
	}
}

/* Remove header margin (vertical center) for archives */
.archive .page-header.header-small .container .hestia-title,
.blog .page-header.header-small .container .hestia-title  {
	margin: 0;
}

/* Style header author meta */
#primary.page-header .author img {
	max-width: 2em;
	border-radius: 100%;
	margin-right: 0.6em;
}

#primary.page-header h4.author .fn, #primary.page-header h4.author time {
	color: #E8E8E8;
}

#primary.page-header h4.author {
	padding-bottom: 10px;
}

#primary.page-header a.author.vcard {
	margin-right: 10px;
}

#primary.page-header .author .date {
	margin-left: 10px;
}

/* Hide header description for archive pages where it's been moved to inline (see functions.php) */
.archive .page-header h5.description {
	display: none;
}

/* Set drop shadow below header, for a bit of separation */
.single #primary {
	box-shadow: rgba(0, 0, 0, 0.25) 0px 10px 40px -25px;
	position: relative;
	z-index: 1;
}

/* Replace category page header images with category-specific ones */

/* Category: Custom Controllers */
.archive.category.category-custom-controllers .header-filter {
	background-image: url(../../uploads/2017/10/McCree-Hammershot_OnBlack-Feature.jpg) !important;
}

/* Category: Programs */
.archive.category.category-programs .header-filter {
	background-image: url(../../uploads/2017/08/TCD-Program-Hex.jpg) !important;
}

/* Category: Props and Replicas */
.archive.category.category-props .header-filter {
	background-image: url(../../uploads/2017/07/header_reaper.jpg) !important;
}

/* Category: Projects -> Multi-Part Projects */
.archive.category.category-multi .header-filter {
	background-image: url(../../uploads/2017/10/TCD_Assembled-3x-Wide.jpg) !important;
}

/* Category: Ambilight */
.archive.category.category-ambilight .header-filter {
	background-image: url(../../uploads/2017/07/header_ambilight.jpg) !important;
}

/* Category: McCree Belt Buckle */
.archive.category.category-mccree-buckle .header-filter {
	background-image: url(../../uploads/2020/01/McCreeBuckle_Finished_Fence_Feature.jpg) !important;
}

/* Category: McCree Hammershot Controller */
.archive.category.category-mccree-hammershot .header-filter {
	background-image: url(../../uploads/2017/10/McCree-Hammershot_OnBlack-Feature.jpg) !important;
}

/* Category: Musical Floppy Drives */
.archive.category.category-musical-floppies .header-filter {
	background-image: url(../../uploads/2019/06/FloppyDrives_CaraMiaAddio.jpg) !important;
}

/* Category: Time Circuits */
.archive.category.category-time-circuits .header-filter {
	background-image: url(../../uploads/2017/10/TCD_Assembled-3x-Wide.jpg) !important;
}

/* Hide "posted by" meta on post loop pages */
article .posted-by.vcard.author {
	display: none;
}

/* Pro Micro USB-A Post Header Position */
.post-3673 #primary.page-header .header-filter {
	background-position: center 35%;
}

/*
 * ##############################################
 * #                    Body                    #
 * ##############################################
 */

/* Prevent floats from floating next to headers */
.entry-content h1, .entry-content h2, .entry-content h3, 
.entry-content h4, .entry-content h5, .entry-content h6 {
	clear: both;
}

/* Remove extra margin in blockquote paragraphs */
.single .blog-post .section-text blockquote p {
	margin: 0;
}

/* Set Gutenberg block captions to match Classic posts */
figure figcaption {
	font-weight: 700;
	text-align: center;
	margin: 0 auto 24px auto;
	font-size: initial;
}

/* Set Gutenberg block image comments to match Classic posts */
.wp-block-image .aligncenter>figcaption, .wp-block-image .alignleft>figcaption, .wp-block-image .alignright>figcaption, .wp-block-image.is-resized>figcaption {
	font-weight: 700;
	text-align: center;
	padding-top: 10px;
	margin: 0;
	font-size: initial;
}

/* Add some extra space below floated image blocks */
.wp-block-image .alignleft, .wp-block-image .alignright {
	margin-bottom: 1em;
}

/* Center left/right floated images when window is too small to show both images and text side-by-side */
@media (max-width: 600px) {
	.wp-block-image .alignleft, .wp-block-image .alignright {
		float: none;
		margin-left: auto;
		margin-right: auto;
	}
}


/*
 * ##############################################
 * #                  Comments                  #
 * ##############################################
 */

/* Fix avatar container size in child comment respond form */
.section-comments ul.children #respond.comment-respond .avatar {
	height: 40px;
	width: 40px;
}

/* Put the "cancel reply" text onto a new line */
.section-comments #respond.comment-respond h3 small {
	display: block;
}


/*
 * ##############################################
 * #                   Footer                   #
 * ##############################################
 */

/* Improve footer menu appearance */
.footer-big ul li a  {
	padding: 0;
	text-transform: none;
}

/* Twitch Font Awesome Social Icon - Very Top Header */
.hestia-top-bar li a[href*="twitch.tv"] {
	font-size: 0;
}

.hestia-top-bar li a[href*="twitch.tv"]:before {
	content: "\f1e8";
}

.hestia-top-bar li a[href*="twitch.tv"]:hover:before {
	color: #6441A4;
}

/* Twitch Font Awesome Social Icon - Footer */
.footer-big .footer-menu li a[href*="twitch.tv"] {
	color: transparent;
	font-size: 0;
	padding: 10px;
}

.footer-big .footer-menu li a[href*="twitch.tv"]:before {
	content: "\f1e8";
	font-family: "Font Awesome 5 Brands";
	font-weight: 900;
	color: #6441A4;
	font-size: 16px;
}

.footer-big .footer-menu li a[href*="twitch.tv"]:hover {
	opacity: 1 !important;
}

.footer-big .footer-menu li a[href*="twitch.tv"]:hover:before {
	color: #6441A4;
}

.footer-black .footer-menu li a[href*="twitch.tv"]:before {
	color: #fff;
}

.hestia-team .footer a[href*="twitch.tv"],
.team .footer a[href*="twitch.tv"],
.footer-menu a[href*="twitch.tv"] {
  color: #6441A4;
}

/*
 * ##############################################
 * #                Landing Page                #
 * ##############################################
 */

/* Landing page "big title" video background */
#carousel-hestia-generic .header-filter {
	z-index: -2;
}

#carousel-hestia-generic .video-background-container {
	position: fixed;
	top: 0; right: 0; bottom: 0; left: 0;
	z-index: -1;
}

#carousel-hestia-generic .video-background,
#carousel-hestia-generic .video-background iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

@media (min-aspect-ratio: 16/9) {
	#carousel-hestia-generic .video-background { height: 300%; top: -100%; }
}
@media (max-aspect-ratio: 16/9) {
	#carousel-hestia-generic .video-background { width: 300%; left: -100%; }
}

/* Make landing page slider full-height */
.home .page-header{
	height: 100vh !important;
}

@media (max-width: 768px) {
	/* Vertically center landing page "big title" on mobile (take into account menu height) */
	.home #carousel-hestia-generic .container {
		margin-top: 70px;
	}
}

/* Replace landing page "header-filter" overlay 
 * (now covers both the header-filter image and the video background)
 */
#carousel-hestia-generic .header-filter:before { 
	background-color: transparent;
}

#carousel-hestia-generic #header-filter-substitute-overlay {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	background: rgba(0,0,0,0.5);
	z-index: -1;
}

/* Add Twitter icon to 'ribbon' feature section button */
.hestia-ribbon .hestia-ribbon-content-right a:before {
	content: "\f099";
	font-family: "Font Awesome 5 Brands";
	font-size: 30px;
	padding-right: 0.3em;
	position: relative;
	top: 0.2em;
}

.hestia-ribbon .hestia-ribbon-content-right a.btn {
	padding-top: 0.15em !important;
	transition: all 0.5s ease;
}

/* Tweak 'ribbon' feature section appearance */
.hestia-ribbon {
	padding: 75px 0;
}

a.btn.btn-md.btn-primary.hestia-subscribe-button:hover {
	filter: grayscale(35%);
}

/* Adjust 'ribbon' feature spacing at small sizes */
@media(max-width:768px) {
	.hestia-ribbon .hestia-ribbon-content-right a.btn {
		margin-top: 20px;
		margin-bottom: 30px;
	}
}

/* Center text in 'contact' LP feature at smaller sizes */
@media (max-width: 991px) {
	.hestia-contact .col-md-5.hestia-contact-title-area {
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		max-width: 400px;
		margin-bottom: 50px;
	}
}

/* Add background gradient to related posts section */
.post .section.related-posts {
	background: linear-gradient(355deg, #00adef 0%, white 78%);
}

/* Make 'contact' section padding bottom-weighted (default: 90 0 70) */
.contactus {
	padding: 70px 0 90px;
}

/* Use strong background gradient on top of image for 'contact' section on front page */
.hestia-contact.section-image:after {
	background: linear-gradient(126deg, rgba(0,173,239,0.97) 0%, rgba(2,0,36,0.9) 80%);
}

/*
 * ##############################################
 * #                Page-Specific               #
 * ##############################################
 */

/* 'About' page header removal */
.page.page-id-22 #primary.page-header {
	display: none;
}

.page.page-id-22 .main {
	padding-top: 50px;
}

/* 'About' page background inset */
@media (min-width: 992px) {
	.page.page-id-22 .main {
		background: url(../../uploads/2016/10/headeralum.jpg);
		background-repeat: no-repeat;
		background-size: 100%;
		background-position: center;
		background-size: cover;
	}

	.page.page-id-22 .main .blog-post {
		max-width: 1060px;
		margin: auto;
		background-color: white;
		-webkit-box-shadow: 0px 0px 40px -10px rgba(0,0,0,0.75);
		-moz-box-shadow: 0px 0px 40px -10px rgba(0,0,0,0.75);
		box-shadow: 0px 0px 40px -10px rgba(0,0,0,0.75);
	}
}

/* Hide social menu on 'About' page 
 * (these are a part of the page, under the avatar)
 */
.page.page-id-22 .hestia-bottom-footer-content .footer-menu {
	display: none;
}

.page.page-id-22 .hestia-bottom-footer-content .copyright {
	float: none !important;
}

/* Increase padding at the bottom of 'About' page */
.page.page-id-22 .blog-post .container {
	padding-bottom: 60px;
}

/*
 * ##############################################
 * #               Printing Styles              #
 * ##############################################
 */

@media print {
	.navbar { position: relative; }  /* hide 'fixed' menu */
	.navbar .navbar-toggle { display: none; }
	
	.single #primary { box-shadow: none;}
	.single #primary.page-header * { color: inherit !important; }
	.single #primary.page-header > .container { height: 200px !important; }

	.footer .copyright { color: inherit !important; }

	#comments #respond { display: none; }
	.akismet_comment_form_privacy_notice { display: none; }
	.section-blog-info .entry-social { display: none; }
	.single .section.related-posts { display: none; }
	.single .section.hestia-ribbon { display: none; }
	.footer-menu { display: none; }
}


/*
 * ##############################################
 * #            Jetpack Social Icons            #
 * ##############################################
 */

 /* Hide "Share This" title for social icons */
div.sharedaddy h3.sd-title {
	display: none !important;
 }

 /* Increase icon size */
 .sd-social-icon .sd-content ul li[class*=share-] a.sd-button:before {
	font-size: 24px;
 }

 /* Do not show social icons on printout */
 @media print {
	.sharedaddy.sd-sharing-enabled { display: none; }
}


/*
 * ##############################################
 * #               Simple Lightbox              #
 * ##############################################
 */

/* Hide title / description in lightbox */
#slb_viewer_wrap .slb_theme_slb_baseline .slb_details {
	display: none !important;
}

/* Center align text in lightbox */
#slb_viewer_wrap .slb_theme_slb_baseline .slb_data_content {
	text-align: center;
}

/* Set lightbox font to theme font (Raleway) */
#slb_viewer_wrap * {
	font-family: Raleway !important;
}

/* Place spacing between lightbox image and title / description */
#slb_viewer_wrap .slb_theme_slb_baseline .slb_details {
	margin-top: 20px !important;
}