/*
Theme Name: Joey's New Blog Theme
Theme URI: https://joeybabcock.me/
Description: A bootstrap 4, responsive and mobile ready theme. It looks spicy, sort of... the menu on the top can be modified without hardcoding in the links, just change them in the appearance menu.
Author: Joey Babcock
Author URI: https://joeybabcock.me/
Version: 1.0
Tags: responsive, joey babcock
*/
body
{
	font-family: Raleway, system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* CLS: stable navbar row before webfonts / full paint */
.navbar.navbar-expand-lg {
	min-height: 3.5rem;
	align-items: center;
}

#home {
	display: inline-block;
	min-height: 40px;
	line-height: 40px;
}

/* Front page video hero: reserve vertical space before jarallax measures */
.head-hook {
	min-height: 300px;
	display: flex;
	align-items: center;
}

@media (min-width: 768px) {
	.head-hook {
		min-height: 640px;
	}
}

.subsite-logo {
	width: 64px;
	height: 64px;
	object-fit: contain;
	vertical-align: middle;
}

/* Video-background jarallax overlay (any jarallax instance id prefix) */
.jarallax.bg-all-dark [id^="jarallax-container"] {
	opacity: 0.5;
}

/* Recent posts: reserve thumbnail area before image decode */
.album .card.shadow-sm > a:first-of-type {
	display: block;
	min-height: 225px;
	background-color: #2a2a2a;
}
.bg-all-dark{
    background-color: #000000!important;
}
.bg-very-dark, .dropdown-menu, .dropdown-item:hover{
    background-color: #121212!important;
}
.bg-more-dark{
    background-color: #242424!important;
}
.bg-some-dark{
    background-color: #333333!important;
}
.nav-link:hover, .text-highlight, a:hover, .nav-item > a:hover, a.hovered
{
	color: rgb(255,64,8)!important;	
}
.btn-secondary.hovered {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
}
.text-newblue, a
{
	color: #6699FF!important;	
}
.navbar-toggle
{
	font-size: 1.5em!important;	
}
.typed-cursor, .typer
{
	display:inline!important;	
}

.masthead a {
    color: rgba(0, 0, 0, 0.8);
    text-decoration: none;
    z-index: 1;
}

.masthead .masthead-cards .card {
    opacity: 1;
    font-size: .8rem;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: .05rem;
    color: #212529;
    transition: .15s all
}

.masthead .masthead-cards .card:hover {
    margin-top: -.25rem;
    margin-bottom: .25rem
}

.masthead .masthead-cards .card:active {
    margin-top: inherit;
    margin-bottom: inherit
}

.masthead .masthead-cards .card.border-bottom-blue:hover {
    color: #6699DD
}

.masthead .masthead-cards .card.border-bottom-green:hover {
    color: #004400
}

.masthead .masthead-cards .card.border-bottom-red:hover {
    color: #dd3d31
}

.masthead .masthead-cards .card.border-bottom-yellow:hover {
    color: #b9a028
}

.masthead-page {
    padding: 1rem 0 4rem
}

@media(min-width: 992px) {
    .masthead-page h1 {
        font-size:2.5rem
    }
    .shadow-lg.shadow-hover:hover {
        box-shadow:0 2.25rem 1.5rem -1.5rem rgba(33,37,41,.3),0 0 1.5rem .5rem rgba(33,37,41,.05)!important
    }

    .shadow-lg.shadow-hover:active {
        box-shadow: 0 2rem 1.5rem -1.5rem rgba(33,37,41,.15),0 0 1.5rem .5rem rgba(33,37,41,.05)
    }
}

.border-bottom-blue,.border-bottom-green,.border-bottom-red,.border-bottom-yellow {
    border-bottom: .4rem solid!important
}

.border-bottom-blue {
    border-color: #6699DD!important
}

.border-bottom-green {
    border-color: #004400!important
}

.border-bottom-red {
    border-color: #dd3d31!important
}

.border-bottom-yellow {
    border-color: #b9a028!important
}
.jarallax {
    position: relative;
    z-index: 0;
}
.jarallax > .jarallax-img {
    position: absolute;
    object-fit: cover;
    /* support for plugin https://github.com/bfred-it/object-fit-images */
    font-family: 'object-fit: cover;';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.subsite-logo-xs
{
	width: 24px;
	height: 24px;
	margin-right: .5rem;
}
.shadowed {
    -webkit-filter: drop-shadow(12px 12px 25px rgba(0,0,0,0.5));
    filter: url(#drop-shadow);
    -ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=12, OffY=12, Color='#444')";
    filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=12, OffY=12, Color='#444')";
}
.doMakeSureNotTooBig {
    height: 225px;
    object-fit: cover;
	object-position: 0 0;
}
.nav-item > a, a.nav-item 
{
	color: #6699DD!important;
	display: block;
    padding: .5rem 1rem;
	text-decoration: none;
}
.nav-item > a:hover, a:hover
{
	text-decoration: none;
}
.wp-caption-text {
	margin-top:10px;
	text-align:center;
	font-size:0.85rem;
	font-style: italic;
	border-top: 1px dashed rgba(255,255,255,0.25);
	margin-bottom:0px;
}
.wp-caption {
	text-align: center;
	margin:20px auto;
	border: 1px solid grey;
	padding: 5px;
}
@media (min-width: 992px) 
{
	.nav-item > a
	{
		padding-right: .5rem;
		padding-left: .5rem;
	}
	.wp-caption-text {
		text-align:left;
		padding:5px;
	}
}
@media (min-width: 768px) 
{
	.wp-caption {
		text-align: left;
		margin: 20px;
	}
	.navbar-brand
	{
		border-right: 2px dashed rgba(255,255,255,.25);
		padding-right: 15px;	
	}
	.alignnone
	{
		display:inline-block;
		overflow-wrap: break-word;
		max-width: 100%;
		margin: 20px 5px;
	}
	.alignright {
		float: right!important;
		margin-right:0px!important;
	}
	.alignleft {
		float: left!important;
		margin-left:0px!important;
	}
}
.post-categories
{
	white-space: normal;
	margin-top:20px;
}
.post-categories > ul > li
{
	display:inline-block;	
}
.post-categories > ul
{
	margin:0;
	padding:0;
}
.btn-somedark {
    background-color: #363636!important;
    border-color: #363636;
	display: inline-block;
}
pre {
	padding:10px;
    border-radius:5px;
	background-color: #363636;
    color: #ffffff!important;
}
.border-top {
    border-top: 1px solid #121212!important;
}
.shadow-reverse {
    box-shadow: 0 -0.75rem 1rem rgba(36, 36, 36, 0.25) !important;
}
.typed-cursor {
	color: #f8f9fa!important;
}
.img-responsive
{
	width: 100%;
	height: auto;
}
hr {
    border-top: 2px dashed rgba(255,255,255,.15);
}
.shadow-thicc {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.25), 0 -0.75rem 1rem rgba(0, 0, 0, 0.25)!important;
}
@media (max-width: 768px) 
{
	
}
.embed-responsive > iframe
{
	overflow:hidden;	
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.embed-responsive > iframe::-webkit-scrollbar { 
    display: none;
}
.aligncenter {
	max-width:100%;
    margin-left: auto;
    margin-right: auto;
}
.btn-secondary {
    color: #fff!important;
    background-color: #444444;
    border-color: #444444;
}
.post-category
{
	font-size: 1.25rem;
}
.footer-link
{
	font-size:1.25rem;
}
.password-protected
{
	margin-left:5px;
	margin-right:5px;
	border-radius: 5px;	
	padding:5px;
}
.input-group-text {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: .375rem .75rem;
    margin-bottom: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: inherit;
    text-align: center;
    white-space: nowrap;
    background-color: #414141;
    border: 1px solid #414141;
    border-radius: .25rem;
}

.text-placeholder-nouppercase::-webkit-input-placeholder { /* WebKit browsers */
    text-transform: none;
}
.text-placeholder-nouppercase:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    text-transform: none;
}
.text-placeholder-nouppercase::-moz-placeholder { /* Mozilla Firefox 19+ */
    text-transform: none;
}
.text-placeholder-nouppercase:-ms-input-placeholder { /* Internet Explorer 10+ */
    text-transform: none;
}
.text-placeholder-nouppercase::placeholder { /* Recent browsers */
    text-transform: none;
}
input[type="number"] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none;
}
.number-input {
    display:inline-block;
}
.number-input button {
    -webkit-appearance: none;
    background-color: transparent;
    border: none;
    align-items: center;
    justify-content: center;
      cursor: pointer;
    margin: 0;
    position: relative;
}
.number-input button:before,
.number-input button:after {
    display: inline-block;
    position: absolute;
    content: '';
    height: 2px;
    transform: translate(-50%, -50%);
}
.number-input button.plus:after {
    transform: translate(-50%, -50%) rotate(90deg);
}
.number-input input[type=number] {
  text-align: center;
  color:#ffffff;
}


.md-number-input.number-input {
  background-color: #545b62;
  width: 11.8rem;
  border-radius: 5px;
}
.md-number-input.number-input button {
  outline: none;
  width: 3rem;
  height: 2rem;
  padding-top: .8rem;
}
.md-number-input.number-input button.minus {
    color:#ffffff;
    padding-left: 8px;
}
.md-number-input.number-input button.plus {
    padding-left: 2px;
}
.md-number-input.number-input button:before,
.md-number-input.number-input button:after {
  width: 1rem;
  background-color: #ffffff;
}
.md-number-input.number-input input[type=number] {
  max-width: 5rem;
  padding: .5rem;
  border: solid #444444;
  background-color: #545b62;
  border-width: 0 2px;
  font-size: 2rem;
  height: 3rem;
  font-weight: bold;
  outline: none;
}
@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (stroke-color:transparent) {
  .number-input.md-number-input.safari_only button:before, 
  .number-input.md-number-input.safari_only button:after {
    margin-top: -.6rem;
  }
}}
tbody tr.even
{
    background-color: #343a40!important;      
}
.pre
{
	font-family: "Courier New",monospace;	
	font-weight:600;
	padding: 3px 5px;
    border-radius: 5px;
    background-color: #363636;
}
.avatar
{
	border-radius:32px;
	margin-right:0.5em;
}
.comment-body, .comments-title, .comment-form > p > label, .comments-area
{
	color: #f8f9fa!important;
}
.form-submit > .submit
{
	color: #fff!important;
    background-color: #444444;
    border-color: #444444;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.comment-form-comment > label
{
	display:none;
}
.comment-form > textarea
{
	border-radius: 5px;
	background-color: #444;
	color: #fff; border-color: transparent;
}
.comment-list
{
	margin-top:1.5em;
}

ol.comment-list, ol.children
{
	list-style-type:none
}

ol.comment-list
{
	padding-left:0px;
}

li.comment
{
	margin-top:1em;
}

.comment-form > p > input
{
	border-radius: 5px;
    background-color: #444;
    color: #fff;
    border-color: transparent;
}

#comment
{
	border-radius: 5px;
    background-color: #444;
    color: #fff;
    border-color: transparent;
	width: 100%;
    box-sizing: border-box;
}

.comment-form-url
{
	display:none;
}

#commentform > textarea
{
	width: 100%;
}

#home
{
	height: 40px;
}

.siteicon
{
	margin-right:1em;
}
blockquote
{
	margin-left: 1em;
    padding-left: 0.5rem;
    border-left: 2px solid white;
    margin-bottom: 0px;
}