/*
Theme Name: ImaginativeThinking
Theme URI: http://ImaginativeThinking.ca/wp-content/themes/ImaginativeThinking/
Author: ImaginativeThinking
Author URI: http://ImaginativeThinking.ca/
Description: A multipurpose, traditional blog theme which contains up to a large three-column layout that is clean, responsive, and highly readable.
Version: 2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: dark, one-column, two-columns, three-columns, left-sidebar, right-sidebar, flexible-width, custom-background, custom-header, custom-menu, featured-images, flexible-header, full-width-template, translation-ready, responsive
*/

body {
	background-color: #1E1E1E;
}

#content {
	max-width: 3072px;
}

/* =Links
-------------------------------------------------------------- */
a,
a:hover,
a:active,
a:focus {
	color: #2B7CA8;
	text-decoration: none;
	-webkit-transition: all .1s ease-in; /* Safari 3.2+, Chrome */
	-moz-transition:    all .1s ease-in; /* Firefox 4-15 */
	-o-transition:      all .1s ease-in; /* Opera 10.5–12.00 */
	transition:         all .1s ease-in; /* Firefox 16+, Opera 12.50+ */
}

a:hover {
	text-decoration: underline;
}

a:active,
a:focus {
	background: rgb( 235, 235, 235 ); /* #ebebeb */
	background: rgba( 50, 50, 50, .1 );
    outline: none;
}

/* =Typography
-------------------------------------------------------------- */

.tagcloud > a {
	color: #333333;
	background-color: #e6e6e6;
	border: 1px solid #adadad;
	border-radius: 4px;
	padding: 5px;
	margin: 5px;
	text-decoration: none;
	display: inline-block;
}

p {
	margin-bottom: 26px;
	line-height: 1.5;
}

#search-header,
#archive-header {
	color: #FFFFFF;
}

h2, h3, h4 {
	border-bottom: solid 1px #333333;
}

blockquote pre {
	background-color: transparent;
	border: none;
}

/* =Menu
-------------------------------------------------------------- */

.menu-entry {
    letter-spacing: 1px;
    color: #FFFFFF;
    text-transform: uppercase;
    font-size: 14px;
		font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; /* Resetting, Font-Awsome changes it */
}

.menu-entry:focus,
.menu-entry:hover {
    background: none !important;
    color: #86BBD8 !important;
}

/*
	The only way to add fa icons in Wordpress without hardcoding is to add it
	to the li class vs a i tag within the anchor. This means the fa icon won't
	hover and that they show up above the menu text. To fix the later we add this
	float: left style to the ::before pseudo-element.
*/
.nav .fa::before {
	float: left;
	margin-top: 10px;
	width: 30px;
}

/* =Site Navigation
-------------------------------------------------------------- */

.site-navigation {
	margin: 0 0 26px 0;
	width: 100%;
}
.site-navigation a {
	color: #FFFFFF;
	text-decoration: none;
}

.site-navigation h2 {
	color: #FFFFFF;
}

.nav-badge {
	padding: 0px;
	border-radius: 5px;
	background-color: #333333;
	border: 1px solid #3A3A3A;
	text-align: center;
	height: 100%;
}

.nav-badge div {
	height: 100%;
}

.nav-badge:hover {
	background-color: #3A3A3A;
}

.nav-badge .container-fluid {
	padding-left: 0px;
	padding-right: 0px;
}

.nav-badge .container-fluid > div.row {
	margin-left: 0px;
	margin-right: 0px;
}

.nav-badge .container-fluid > div.row > div {
	width: 100%;
}

.post-navigation .nav-badge .container-fluid > div.row > div > div:nth-child(2) {
	vertical-align: top;
}

.comment-navigation .nav-next .container-fluid > div.row > div > div:nth-child(1),
.comment-navigation .nav-previous .container-fluid > div.row > div > div:nth-child(2),
.paging-navigation .nav-next .container-fluid > div.row > div > div:nth-child(1),
.paging-navigation .nav-previous .container-fluid > div.row > div > div:nth-child(2) {
	vertical-align: middle;
	text-align: center;
}

.comment-navigation .nav-next .container-fluid > div.row > div > div:nth-child(2),
.comment-navigation .nav-previous .container-fluid > div.row > div > div:first-of-type,
.paging-navigation .nav-next .container-fluid > div.row > div > div:nth-child(2),
.paging-navigation .nav-previous .container-fluid > div.row > div > div:first-of-type,
.post-navigation .nav-badge .container-fluid > div.row > div > div:first-of-type {
	padding-left: 0px;
	padding-right: 0px;
	background-color: #FFFFFF;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	vertical-align: middle;
}

#nav-above {
	margin:0 0 30px 0;
}

#nav-below.post-navigation {
	border-bottom: 1px solid #CECECE;
	padding-bottom: 25px;
}

.comment-navigation .nav-next .container-fluid > div.row > div > div:nth-child(2),
.paging-navigation .nav-next .container-fluid > div.row > div > div:nth-child(2) {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}

.comment-navigation .nav-next img,
.paging-navigation .nav-next img {
	-ms-transform: rotate(180deg); /* IE 9 */
	-webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
	transform: rotate(180deg);
}

/* = Header
-------------------------------------------------------------- */

#brand-logo {
	width: 60px;
}

#top-nav-bar .navbar-brand {
	height: 100px;
	font-weight: 800;
}

#top-nav-bar .nav li a,
#top-nav-bar .navbar-brand {
	color: #FFFFFF;
}

#top-nav-bar .navbar-brand:hover,
#top-nav-bar .navbar-brand:focus,
#top-nav-bar .nav li a:hover,
#top-nav-bar .nav li a:focus {
	color: #EDEDED;
	background-color: transparent;
}

#top-nav-bar .navbar-brand .container-fluid {
	display: none;
}

#top-nav-open {
	display: none;
	z-index: 1;
	position: absolute;
	top: 0;
	right: 0;
	margin: 5px 5px 0px 0px;
}

#top-nav-close,
#top-nav-open {
	font-weight: 800;
	font-size: 22pt;
}

#top-nav-close {
	margin: 5px 5px 15px auto;
	display: none;
}

.btn-dark {
	border-radius: 0;
	color: #FFFFFF;
	background-color: rgba(0,0,0,0.4);
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active {
	background-color: rgba(0,0,0,0.7);
	color: #FFFFFF;
}

#top-nav-bar .nav li a {
	text-transform: uppercase;
	font-weight: 800;
	letter-spacing: 1px;
}

#top-nav-bar h1 {
	margin-top: 0px;
}

#top-nav-bar h1 .heighlight {
	color: #E46C0B;
}

#top-nav-bar {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 3;
	background: transparent;
	-webkit-transition: background-color 0.3s;
	-moz-transition: background-color 0.3s;
	transition: background-color 0.3s;
}

#top-nav-bar.is-fixed {
	/* when the user scrolls down, we hide the header right above the viewport */
	position: fixed;
	top: -103px;
	background-color: rgba(65, 75, 89, 0.9);
	border-bottom: 1px solid #E46C0B;
	-webkit-transition: background-color 0.3s, -webkit-transform 0.3s;
	-moz-transition: background-color 0.3s, -moz-transform 0.3s;
	transition: background-color 0.3s, transform 0.3s;
}

#top-nav-bar.is-visible {
	/* if the user changes the scrolling direction, we show the header */
	-webkit-transform: translate3d(0, 100%, 0);
	-moz-transform: translate3d(0, 100%, 0);
	-ms-transform: translate3d(0, 100%, 0);
	-o-transform: translate3d(0, 100%, 0);
	transform: translate3d(0, 100%, 0);
}

#top-nav-bar.is-fixed .navbar-brand .container-fluid {
	display: block;
}

hr.small {
	max-width: 100px;
	margin: 15px auto;
	border: solid 4px #FFFFFF;
}

#intro-header {
	margin-bottom: 50px;
}

#site-heading {
	padding: 100px 0px 50px;
	color: #FFFFFF;
	text-align: center;
}

#site-heading h1 {
	margin-top: 0px;
	font-size: 80px;
}

#site-heading h1 .heighlight {
	font-size: 85px;
	color: #E46C0B;
}

#subheading {
	line-height: 1.1;
	display: block;
	font-weight: 300;
	margin: 10px 0px 0px;
}

/* = 404
-------------------------------------------------------------- */

#notFoundPage ul {
	list-style: none;
	padding-left: 40px;
	padding-right: 40px;
}

#notFoundPage  .widget {
	border: solid 1px #3A3A3A;
}

/* = Search Form
-------------------------------------------------------------- */

form[role='search'] input[type='text'] {
	height: auto;
}

form[role='search'] input[type='text'],
form[role='search'] button {
	font-size: 25px;
}

/* =Side Bars
-------------------------------------------------------------- */

#topbanner {
  margin-bottom: 10px;
	width: 100%;
}

#topbanner aside.widget {
    margin: 0;
}

#left-column ul,
#right-column ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

aside.widget {
	padding: 5px 5px 10px 5px;
}

.widget {
	margin-top: 40px;
	background-color: #FFFFFF;
}

.widget h1,
.widget h2 {
	margin: -5px -5px 15px -5px;
	padding-left: 5px;
	padding-right: 5px;
	color: #FFFFFF;
	background-color: #333333;
	border: 1px solid #3A3A3A;
	line-height: 1.4;
}

/* =Side Bars - Recent Posts Widget
-------------------------------------------------------------- */

.widget_pages li,
.widget_recent_entries li,
.widget_recent_comments li a,
.widget_top-posts li {
	padding: 5px 5px 5px 5px;
	margin-top: 10px;
	min-height: 40px;
	font-weight: bold;
}

.widget_pages li:not(:last-child),
.widget_recent_entries li:not(:last-child),
.widget_recent_comments li:not(:last-child),
.widget_top-posts li:not(:last-child) {
	border-bottom: 2px groove #333333;
	padding-bottom: 15px;
}

.widget_recent_comments li .comment-author-link {
	font-weight: bold;
}

/* =Side Bars - Archive Widget
-------------------------------------------------------------- */

.widget_categories {
	overflow-x: auto;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

.widget_calendar table {
	width: 100%;
}

/* =Side Bars - Meta Widget
-------------------------------------------------------------- */

.widget_meta li a {
	color: #FFFFFF;
	background-color: #337ab7;
	text-decoration: none;
	display: inline-block;
	padding: 6px 12px;
	margin-bottom: 0px;
	font-weight: 400;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	touch-action: manipulation;
	cursor: pointer;
	border: 1px solid #2e6da4;
	border-radius: 4px;
	width: 100%;
	font-size: 15pt !important;
	margin: 5px 0px 5px 0px;
}

.widget_meta li a:hover {
	color: #FFFFFF;
	background-color: #286090;
	border-color: #204d74;
	text-decoration: none;
}

.widget_meta li a abbr {
	cursor: pointer !important;
}

/* =Side Bars - Tag-Cloud Widget
-------------------------------------------------------------- */

.tagcloud {
    padding: 5px;
}

/* =Side Bars - Search Widget
-------------------------------------------------------------- */

.widget_search {
	background-color: transparent;
}

/* =Share Button Widget
-------------------------------------------------------------- */

div.sharedaddy > div.sd-social > h3.sd-title {
	font-size: 12pt;
}

div.sharedaddy > div.sd-social > div.sd-content > div.sharing-hidden > div > ul li a::before,
div.sharedaddy > div.sd-social > div.sd-content > ul li a:not(.share-more)::before {
	font-size: 26pt;
}

div.sharedaddy > div.sd-social > div.sd-content > ul li a.share-more,
div.sharedaddy > div.sd-social > div.sd-content > ul li a.share-more::before {
	font-size: 12pt;
}

div.sharedaddy > div.sd-social > div.sd-content > ul li a.share-more {
	padding: 10px;
}

/* =Images
-------------------------------------------------------------- */

img {
	height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
	max-width: 100%; /* Prevent images from overflowing their boundaries. */
}

#ie8 img {
	width: auto; /* Prevent stretching of full-size images with height and width attributes in IE8. */
}

.aligncenter,
.alignleft,
.alignright,
.alignnone {
	display: block;
}

.aligncenter { /* Center-aligned images with no captions. */
	margin: 26px auto;
}

.alignleft { /* Left-aligned images with no captions. */
	float: left;
	margin: 26px 26px 26px 0;
}

.alignright { /* Right-aligned images with no captions. */
	float: right;
	margin: 26px 0 26px 26px;
}

.alignnone { /* Images with no alignments and no captions. */
	display: inline;
	margin: 0 0 -7px 0;
}

div.alignnone { /* Captions with no alignment. */
	display: block;
}

.wp-caption { /* WordPress Captions. */
	border: 1px solid #333333;
	border-radius: 5px;
	max-width: 96%; /* Prevent captions from overflowing into sidebars and other adjacent content. */
	padding: 13px 8px 3px; /* WordPress automatically adds 5 pixels of padding on the right and left sides of captions, add balance. */
}

.wp-caption img {
	display: block;
	margin: 0 auto 3px auto;
}

.wp-caption-text { /* This text is contained within the caption. */
	font-size: 16pt !important;
	font-style: italic;
	margin: 0 !important;
	padding: 2px 0 3px 0;
	text-align: center;
}

/* =Blog Post Entries
-------------------------------------------------------------- */

article {
	position: relative;
	background-color: #FFFFFF !important;
	color: #000000 !important;
	text-align: left;
}

article .time-container {
    margin-right: 10px;
    border-right: 1px #CECECE solid;
    text-align: right;
}

article .time-container a {
	color: #000000;
}

article > header h2 a:hover,
article .time-container a:hover {
	color: #2B7CA8;
	text-decoration: none;
}

article .postMonth, .postYear {
    font-size: 10pt;
}
article .postDay {
    font-size: 16pt;
}

article .postMonth {
    text-transform: uppercase;
}

article > header > h2 > a {
	color: #000000;
}

article p {
	margin-bottom: 26px !important;
}

article > header a,
article > header img {
	vertical-align: middle;
}

article > header img {
	margin-right: 5px;
	border-radius: 5px;
	height: 32px;
	width: 32px;
}

article > div:first-of-type {
	margin-top: 5px;
	margin-bottom: 50px;
}

.edit-link {
	position: absolute;
	right: 20px;
	top: 10px;
}

.entry-meta > div:not(.container-fluid) {
	padding: 5px 0px 5px 0px;
}

.entry-meta div.col-lg-4 {
	padding: 0px 5px 0px 5px;
}

.entry-meta i,
.entry-meta a {
	font-size: 18pt !important;
}

.entry-meta a.btn-primary {
	margin-left: 10px;
}

.entry-meta a:not(.btn-primary) {
	color: #333333;
	background-color: #e6e6e6;
	text-decoration: none;
	display: inline-block;
	padding: 6px 12px;
	margin-bottom: 0px;
	font-weight: 400;
	line-height: 1.42857143;
	text-align: center;
	white-space: nowrap;
	touch-action: manipulation;
	cursor: pointer;
	border: 1px solid #CCCCCC;
	border-radius: 4px;
}

.entry-meta a:hover:not(.btn-primary) {
	color: #333333;
	background-color: #B5B5B5;
	border-color: #adadad;
	text-decoration: none;
}

.entry-meta .post-bookmark i {
	margin-left: 4px;
}

.entry-meta .post-bookmark a {
	margin-left: 12px;
}

.entry-meta ul {
	display: inline;
	list-style: none;
	margin: 0;
	padding: 0;
}

.entry-meta ul li {
	display: inline;
	margin: 0px 5px 0px 5px;
}

aside:not(.widget) {
	margin: 55px 15px 55px 15px;
	padding: 20px 20px 20px 75px;
	background-color: #F2F2F2;
	-moz-border-radius: 5px;
	border-radius: 5px;
	min-height: 100px;
}

code,
pre > code {
	color: #4BC629;
	background-color: #333333;
	border: 1px solid #3A3A3A;
	border-radius: 5px;
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
	font-size: 14pt;
	overflow: auto;
	max-width: 100%;
}

pre > code {
	display: block;
	margin: -9.5px;
	padding: 0px 15px 15px 15px;
	max-width: 110%;
}

code {
	padding: 4px;
}

.inpostad {
	width: 300px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px
}

.inpostad p {
	margin-bottom: 0 !important;
	color: #A5A5A5;
}

/* =Override SyntaxHighlighter plugin
	-------------------------------------------------------------- */

	div.dp-highlighter {
		font-size: 16pt;
		border: solid 1px #333333;
	}

	div.dp-highlighter .bar {
		padding-left: 65px;
	}

	div.dp-highlighter ol {
		margin-left: 65px;
	}

	div.dp-highlighter ol li {
		line-height: 30px;
	}

/* =Author Bio
	-------------------------------------------------------------- */

	.author-bio {
		background-color: #FFFFFF !important;
	}

/* =Comments
	-------------------------------------------------------------- */

#respond {
	margin-top: 20px;
}

#comments h2,
#comment-title,
#comments-closed,
#commentform label,
#commentform small,
#comments p.logged-in-as {
	color: #FFFFFF;
}

#comment-title span {
	font-style: italic;
}

#comment-list {
	margin-top: 40px;
	padding-left: 0;
}

#commentform label,
#commentform textarea {
	font-size: 16pt;
}

#commentform small {
	font-size: 14pt;
}

#commentform .required {
	font-size: 20pt;
	vertical-align: top;
	color: red;
}

/* =Comments -- Jetpack
	-------------------------------------------------------------- */

#comments h3 {
	color: #FFFFFF;
}

/* =Footer
-------------------------------------------------------------- */

#pageFooter {
	background-color: #414B59;
	color: #FFFFFF;
	margin-top: 20px;
  position: relative;
  /*top: 100vh;*/
  z-index: 2;
}

#pageFooter a {
	color: #FFFFFF;
}

#pageFooter a:hover {
	color: #86BBD8;
}

.row-height {
	display: table;
	height: 100%;
}

.col-height {
	display: table-cell;
	height: 100%;
	float: none;
}

#footer-about-blog {
	background: url("assets/images/glowing-keyboard.jpg") no-repeat scroll 0 0 / cover  rgba(0, 0, 0, 0);
}

#footer-about-me {
	background: url("assets/images/code-bg.jpeg") no-repeat scroll 0 0 / cover  rgba(0, 0, 0, 0);
}

.footer-about > div:not(.about-popup) {
	position: relative;
  margin-top: 25px;
	z-index: 1;
	background: rgba(0,0,0,0.5);
}

.footer-about {
	overflow: hidden;
}

.footer-about p {
	margin-left: 200px;
}

.footer-about > a:hover {
	color: #FFFFFF !important;
}

.footer-about > img {
	position: absolute;
	top: 10px;
	height: 90%;
	padding-bottom: 10px;
	max-height: 450px;
}

.footer-about .about-popup {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 10;
	opacity: 0;
	background-color: #0c9ad7;
}

.footer-about .about-popup:hover {
	opacity: 100;
}

.footer-about .about-popup p:first-of-type {
	font-size: 72pt !important;
}

.footer-about .about-popup p {
	margin-left: 0px;
}

#footer-signoff {
	background-color: #E46C0B;
}

#footer-signoff p {
	font-style: italic;
	color: #FFFFFF;
	padding: 20px 0px 20px 0px;
	margin: 0px;
}

.footer-hr {
	height: 4px;
	background-color: #E46C0B;
	margin-bottom: 10px;
}

#footer-social {
	margin-top: 10px;
	margin-bottom: 20px;
  font-size: 3em;
}

#footerNav,
#footer-social h2 {
    color: #FFFFFF;
}

#footer-social a {
	color: #2B7CA8;
}

#footer-social a:hover {
    text-decoration: none;
}

#footer-social ul {
    padding: 0px;
}

#footer-social ul li {
    list-style-type: none;
    display: inline-block;
}

#footer-copyright {
    margin-top: 100px;
}

#footer-copyright p {
	color: #FFFFFF;
	margin: 0 0 10px 0;
	width: 100%;
	text-align: center;
}

#canada img {
    width: 200px;
}

#pageFooter .menu-entry {
    font-size: 16pt;
    padding-left: 0px !important;
}

#header .fa-li,
#footerNav .fa-li {
    padding-top: 10px;
    padding-bottom: 10px;
}

/* = Jetpack Infinit Scroll Support
-------------------------------------------------------------- */
/* @see https://jetpack.com/support/infinite-scroll/ */

/* Hides navigation links and site footer when infinite scroll is active */
.infinite-scroll #nav-above,
.infinite-scroll #nav-below,
.infinite-scroll.neverending #pageFooter {
	display: none;
}

/* Shows the footer again in case all posts have been loaded */
.infinity-end.neverending #pageFooter {
	display: block;
}

#infinite-footer div.container {
	background: rgba(65, 75, 89, 0.8); /* #414B59 */
	border-top: solid 1px #E46C0B;
}

#infinite-footer div.container > div {
	min-height: 50px;
	vertical-align: middle;
	line-height: 50px;
	color: #FFFFFF;
}

#infinite-footer div.container > div > a {
	color: #FFFFFF;
}

#infinite-footer div.container > div.blog-info {
	width: 100%;
	text-align: center;
}

#infinite-footer div.container > div.blog-credits {
	display: none;
}

#infinite-handle {
	width: 100%;
	height: 125px;
}

#infinite-handle > span {
	display: block;
	height: 100%;
}

#infinite-handle > span > button {
	width: 100%;
	height: 100%;
	font-size: 16pt !important;
	text-transform: capitalize;
}

/* Jetpack - Gravitar
-------------------------------------------------------------- */

div.gcard {
	padding: 0px !important;
	margin: 8px 0px;
}

div.gcard div.grav-info p.grav-loc {
	font-size: 12pt !important;
}

div.gcard div.grav-inner {
	background-color: rgba(0,0,0,0.7);
}

.grav-clone-a .avatar-256 {
	border: solid 2px #FFFFFF !important;
}


/* =Media Queries
-------------------------------------------------------------- */

/*
 * min-width: >=
 *   min-width: 100px --> 100px and greater (101, 102, ..., 500000)
 *
 * max-width: <=
 *   max-width: 100px --> 100px and smaller (99, 98, ..., 0)
 */


/* =Styles in larger displays will casscade down to smaller displays
    Styles set in larger displays can be overwritten in smaller display queires.
-------------------------------------------------------------- */

/* Extra Extra Extra Large Devices ( > 4K, i.e. 8K ) will use default settings, that is 8K displays are not yet propertly supported. */

/* Extra Extra Large Devices, 4K Screens */
@media only screen and (max-width : 4096px) {

	/* =Typography
	-------------------------------------------------------------- */
		a, a.btn, .dp-highlighter .bar .tools a, /* .dp-highlighter === Google Code Stylizer */
		p, .jumbotron p,
		aside:not(.widget),
		div > pre {
			font-size: 26pt;
		}

		blockquote,
		blockquote > pre {
			font-size: 28pt;
		}

		p.big {
			font-size: 32pt;
		}

		#top-nav-bar h1 {
			font-size: 30px;
    }

		#top-nav-bar h1 .heighlight {
			font-size: 35px;
		}

		h2, h3, h4 {
			margin-top: 60px;
		}

    h2 {
			font-size: 32pt;
    }

		h3 {
			font-size: 30pt;
    }

    h4 {
			font-size: 28pt;
    }

		figcaption {
			font-size: 26pt;
			font-weight: bold;
    }

	/* =Social Widget -- Jetpack
	-------------------------------------------------------------- */
		a.genericon {
			font-size: 26pt;
		}

	/* =Side Bars - Widgets
	-------------------------------------------------------------- */
		.widget_recent_comments li {
			font-size: 26pt;
		}

	/* =Menu
	-------------------------------------------------------------- */
		.menu-entry {
			font-size: 16pt;
    }

	/* =Blog Post Entries
	-------------------------------------------------------------- */
    article .postMonth, .postYear {
			font-size: 20pt;
    }
    article .postDay {
			font-size: 26pt;
    }

		article > div div.row > div:not(.dp-highlighter) > ul > li,
		article > div div.row > div:not(.dp-highlighter) > ol > li {
			font-size: 26pt;
			margin-left: 60px;
		}

	/* =Footer
	-------------------------------------------------------------- */
		#footer-subscribe p {
			font-size: 20pt !important;
		}

		/* Jetpack - Gravitar
		-------------------------------------------------------------- */
		div.gcard {
			width: 800px;
		}

		div.gcard .grav-info {
			width: 620px;
		}

		div.gcard div.grav-info p.grav-loc {
			font-size: 16pt !important;
		}

		div.gcard div.grav-info div.grav-viwe-complete-button {
			line-height: 220%;
		}
}

/* Extra Large Devices, WUXGA Screens */
@media only screen and (max-width : 1920px) {

	/* =Typography
	-------------------------------------------------------------- */
    a, a.btn, .dp-highlighter .bar .tools a, /* .dp-highlighter === Google Code Stylizer */
		p, .jumbotron p,
		aside:not(.widget),
		div > pre {
			font-size: 18pt;
		}

		blockquote,
		blockquote > pre {
			font-size: 20pt;
		}

		p.big {
			font-size: 22pt;
		}

	/* =Social Widget -- Jetpack
	-------------------------------------------------------------- */
		a.genericon {
			font-size: 18pt;
		}

	/* =Side Bars - Widgets
	-------------------------------------------------------------- */
		.widget_recent_comments li {
			font-size: 18pt;
		}

		.widget h1 {
			font-size: 30px;
		}

	/* Jetpack - Gravitar
		-------------------------------------------------------------- */
		div.gcard {
			width: 700px;
		}

		div.gcard .grav-info {
			width: 520px;
		}

	/* =Blog Post Entries
	-------------------------------------------------------------- */
		article > div div.row > div:not(.dp-highlighter) ul > li,
		article > div div.row > div:not(.dp-highlighter) ol > li {
			font-size: 18pt;
			margin-left: 20px;
		}
}

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

	/* =Typography
	-------------------------------------------------------------- */

    #top-nav-bar h1 {
			font-size: 22px;
    }

		#top-nav-bar h1 .heighlight {
			font-size: 27px;
		}

    h2 {
			font-size: 24pt;
    }

		h3 {
			font-size: 22pt;
    }

    h4 {
			font-size: 20pt;
    }

		figcaption {
			font-size: 18pt;
			font-weight: bold;
    }

	/* =Menu
	-------------------------------------------------------------- */

		.menu-entry {
			font-size: 12pt;
    }

	/* =Site Navigation
	-------------------------------------------------------------- */

		.nav-previous {
			margin-bottom: 20px;
		}

	/* =Blog Post Entries
	-------------------------------------------------------------- */

    article .postMonth, .postYear {
			font-size: 12pt;
    }
    article .postDay {
			font-size: 18pt;
    }

		.entry-meta div.col-md-12 {
			padding: 5px 0px 5px 0px;
		}

		/* Jetpack - Gravitar
		-------------------------------------------------------------- */
		div.gcard {
			width: 600px;
		}

		div.gcard .grav-info {
			width: 420px;
		}
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

	/* =Typography
	-------------------------------------------------------------- */

		#top-nav-bar h1 {
			font-size: 24px;
    }

		#top-nav-bar h1 .heighlight {
			font-size: 29px;
		}

	/* = Header
	-------------------------------------------------------------- */

		#site-heading h1 {
			font-size: 70px;
		}

		#site-heading h1 .heighlight {
			font-size: 75px;
		}

	/* =Blog Post Entries
	-------------------------------------------------------------- */

		article .time-container {
			border-right: none;
    }

    article .postDay,
    article .postMonth,
    article .postYear {
			font-size: 12pt;
			float: left;
			padding-right: 5px;
			margin-bottom: 10px;
			border-bottom: 1px #CECECE solid;
    }

	/* =Author Bio
	-------------------------------------------------------------- */

	.author-bio img {
		max-width: 100px;
	}

	.author-bio div.col-md-2 {
		margin-bottom: 15px;
	}

	/* =Site Navigation
	-------------------------------------------------------------- */

		.post-navigation .nav-badge .container-fluid > div.row > div > div:first-of-type {
			padding-right: 0px;
		}

		.post-navigation .nav-badge .container-fluid > div.row > div > div:first-of-type {
			border-top-left-radius: 5px;
			border-top-right-radius: 5px;
			border-bottom-left-radius: 0px;
		}

	/* =Footer
	-------------------------------------------------------------- */

		.footer-about .about-popup p:first-of-type {
			font-size: 50pt !important;
		}

		#footer-about-me {
			margin-top: 5px;
		}

		#pageFooter .row-md-height {
			background-color: #E46C0B;
		}

	/* Jetpack - Gravitar
		-------------------------------------------------------------- */
		div.gcard {
			width: 500px;
		}

		div.gcard .grav-info {
			width: 320px;
		}
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

		#content {
			padding: 0;
		}

		#center-column {
			padding: 0;
		}

		#center-column article {
			border-radius: 0px !important;
		}

	/* =Typography
	-------------------------------------------------------------- */
    a, a.btn, .dp-highlighter .bar .tools a, /* .dp-highlighter === Google Code Stylizer */
		p, .jumbotron p,
		aside:not(.widget),
		div > pre {
			font-size: 16pt;
		}

		blockquote,
		blockquote > pre {
			font-size: 18pt;
		}

		p.big {
			font-size: 20pt;
		}

		#top-nav-bar h1 {
      font-size: 28px;
    }

		#top-nav-bar h1 .heighlight {
			font-size: 33px;
		}

    h4 {
       font-size: 18pt;
    }

		figcaption {
			font-size: 16pt;
			font-weight: bold;
    }

	/* =Social Widget -- Jetpack
	-------------------------------------------------------------- */
		a.genericon {
			font-size: 16pt;
		}

	/* =Header
	-------------------------------------------------------------- */
		#top-nav-menu {
			z-index: 1000;
			position: fixed;
			right: 0;
			top: 0px;
			width: 320px;
			min-height: 100vh;
			transform: translateX(320px);
			overflow-y: auto;
			background: rgba(65, 75, 89, 0.9);
			-webkit-transition: all 0.4s ease 0s;
			-moz-transition: all 0.4s ease 0s;
			-ms-transition: all 0.4s ease 0s;
			-o-transition: all 0.4s ease 0s;
			transition: all 0.4s ease 0s;
		}

		#top-nav-menu.in {
			right: 320px;
		}

		#top-nav-close,
		#top-nav-open {
			display: block;
		}

		#site-heading h1 {
			font-size: 40px;
		}

		#site-heading h1 .heighlight {
			font-size: 45px;
		}

	/* =Blog Post Entries
	-------------------------------------------------------------- */

		aside:not(.widget) {
			padding: 20px 20px 20px 20px;
			background-image: none;
		}

		article > div div.row > div:not(.dp-highlighter) ul > li,
		article > div div.row > div:not(.dp-highlighter) ol > li {
			font-size: 16pt;
			margin-left: 10px;
		}

	/* =Menu
	-------------------------------------------------------------- */
    .menu-entry {
       font-size: 16pt;
    }

	/* =Comments
	-------------------------------------------------------------- */
		.comment-author > .row > div:first-of-type {
			padding-bottom: 10px;
		}

  /* =Footer
	-------------------------------------------------------------- */

		.footer-about p {
			margin-left: 5px;
			margin-right: 5px;
		}
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {

	/* =Header
	-------------------------------------------------------------- */
		#site-heading h1 {
			font-size: 30px;
		}

		#site-heading h1 .heighlight {
			font-size: 35px;
		}

	/* =Footer
	-------------------------------------------------------------- */

		.footer-about .about-popup p:first-of-type {
			font-size: 72pt !important;
		}

    #footer-social {
			font-size: 2em;
    }
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}


/* =Styles in smaller displays will casscade down to larger displays
    Styles set in smaller displays can be overwritten in larger display queires.
    The below styles will override the above media queires.
-------------------------------------------------------------- */

/* Small Devices (Tablets) and up */
@media only screen and (min-width : 768px) {
		.row-sm-height {
			display: table;
			height: 100%;
			width: 100%;
		}

		.col-sm-height {
			display: table-cell;
			height: 100%;
			float: none;
		}

	/* =Header
	-------------------------------------------------------------- */

	#top-nav-bar {
			position: fixed;
			border-bottom: 1px solid transparent;
			-webkit-transition: background-color 0.3s;
			-moz-transition: background-color 0.3s;
			transition: background-color 0.3s;
			/* Force Hardware Acceleration in WebKit */
			-webkit-transform: translate3d(0, 0, 0);
			-moz-transform: translate3d(0, 0, 0);
			-ms-transform: translate3d(0, 0, 0);
			-o-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
			-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
		}

		#top-nav-bar .nav li a,
		#top-nav-bar .navbar-brand {
			color: #FFFFFF;
			padding: 20px;
		}

		#top-nav-bar .nav li a:hover,
		#top-nav-bar .nav li a:focus,
		#top-nav-bar .navbar-brand:hover,
		#top-nav-bar .navbar-brand:focus {
			color: rgba(255, 255, 255, 0.8);
		}

		#site-heading {
			padding: 150px 0px;
		}

		/* Jetpack - Gravitar
		-------------------------------------------------------------- */
		div.gcard {
			max-width: 500px;
		}
}

/* Medium Devices (Desktops) and up */
@media only screen and (min-width : 992px) {
		.row-md-height {
			display: table;
			height: 100%;
			width: 100%;
		}

		.col-md-height {
			display: table-cell;
			height: 100%;
			float: none;
		}

		/* Jetpack - Gravitar
		-------------------------------------------------------------- */
		div.gcard {
			max-width: 600px;
		}
}

/* Large Displays (Wide Screens) and up */
@media only screen and (min-width : 1200px) {
		.row-lg-height {
			display: table;
			height: 100%;
			width: 100%;
		}

		.col-lg-height {
			display: table-cell;
			height: 100%;
			float: none;
		}

		.summary-meta {
			padding: 10px 0px 10px 0px;
			border-top: 1px solid #333333;
			border-bottom: 1px solid #333333;
		}

		/* =Side Bars - Archive Widget
		-------------------------------------------------------------- */

			.widget_rss_links li:before,
			.widget_archive li:before,
			.widget_categories li:before {
				font-family: FontAwesome;
				font-size: 18pt;
				padding-right: 15px;
				vertical-align: baseline;
			}

			.widget_archive li:before{
				content: "\F073";
			}

			.widget_categories li:before {
				content: "\F0E8";
			}

			.widget_rss_links li:before {
				content: "\F09E";
			}

		/* Jetpack - Gravitar
		-------------------------------------------------------------- */

			div.gcard .grav-info {
				margin-top: 10px;
			}
}

/* Extra Large Devices (WUXGA Screens) and up */
@media only screen and (min-width : 1920px) {
    /* Override Bootstrap's hidden-lg class to limited it at 1920px so we can add the 'hidden-xl' class. */
    .hidden-lg {
        display: inherit !important;
    }

    .hidden-xl {
        display: none !important;
    }

		.row-xl-height {
			display: table;
			height: 100%;
			width: 100%;
		}

		.col-xl-height {
			display: table-cell;
			height: 100%;
			float: none;
		}

		.inpostad {
			width: 400px;
		}

		/* =Side Bars - Archive Widget
		-------------------------------------------------------------- */

			.widget_rss_links li:before,
			.widget_archive li:before,
			.widget_categories li:before {
				font-size: 20pt;
				vertical-align: super;
			}

			.widget_meta li a {
				font-size: 26pt !important;
			}

		/* Jetpack - Gravitar
		-------------------------------------------------------------- */

			div.gcard {
				max-width: 800px;
			}

			div.gcard .grav-info {
				margin-top: 20px;
			}
}