/* Generally turns all the background white */
body {
	background-color: #fff;
}

/* General coloring on the links */
a:link {
	color: #005C8F;
}

a:hover {
	color: #0A3971;
}

a:visited {
	color: #005C8F;
}

/* Styles the header area */
#masthead {
	background: #fff;
	width: 100vw;
	position: relative;
	top: 0;
	margin: 0;
}

.header-main {
	background: rgba(255,255,255,.6);
	padding-top: 0;
	padding-bottom: 0;
}

.site-branding, .custom-logo, .site-title, .site-description {
	background: transparent;
}

/* Gets rid of strange header bar that seems to have no purpose */
#header-top.header-bar-wrap {
	background-color: #fff;
	display: none;
}

/* Reins in the size of the logo */
.site-branding .custom-logo {
	width: 220px;
}

/* Blog title; it's a link so the color has to be styled as a link */
.site-title {
	margin-top: 8px;
	float: center;
	font-size: 2.2em;
}

@media only screen and (max-width: 60em) {
	.site-branding .site-title {
    float: none;
    text-align: center;
	}

}

@media only screen and (max-width: 30em) {
	.site-branding .site-title {
	  font-size: 1.2em;
		margin-top: 10px;
		line-height: 1.5em;
	}
}

.site-title  a:link, .site-title a:hover, .site-title a:visited {
	color: #005C8F;
}

/* The one-line subtitle */
p.site-description {
	color: #0092C6;
}

/* The wrapper for the navigation */
.primary-navigation-wrap {
	border-bottom: 1px solid #eee;
	background-color: transparent;
}

.main-navigation-menu-wrap {
	border-top: transparent;
}

/* The menu items */
.main-navigation-menu a:link {
	color: #005C8F;
	text-transform: capitalize;
	font-weight: 500;
	font-size: .8em;
	background-color: transparent;
	border: transparent;
	padding-top: 5px;
	padding-bottom: 5px;
}

.main-navigation-menu a:hover {
	color: white;
	background-color: #F2C864;
	border-radius: 5px 5px 0 0;
}

.main-navigation-menu a:visited {
	color: #005C8F;
}

/* The menu button that comes up in smaller screens */
#main-navigation-toggle {
	background-color: #005C8F;
	outline: 0;
	padding: 5px 10px;
	margin-top: 10px;
	border-radius: 5px 5px 0 0;
}

#main-navigation-toggle:visited {
	border: 5px solid black;
}

/* Hides some mysterious duplicate menu that was coming up in mobile */
.mobile-top-menu {
	display: none;
}

/* Styles the post tiles on the main page */
.type-post {
	box-shadow: 0 5px 10px #ddd;
	border-top: 5px solid #74C7E5;
	border-radius: 5px;
	transition: .3s;
}

/* Hover effect for post tiles */
.type-post:hover {
	transform: scale(1.05);
	box-shadow: 0 5px 10px #bbb;
}

/* Manages the opacity on the post thumbnail for hover effect */
.attachment-post-thumbnail {
	opacity: .5;
	border-radius: 5px;
	transition: .3s;
}

.type-post:hover .attachment-post-thumbnail {
	opacity: 1;
}

/* The titles for the cards */
.entry-title {
  line-height: 1.2;
	text-transform: capitalize;
}

.entry-header .entry-title a {
	color: #005C8F;
}

.entry-header .entry-title a:hover {
	color: #0092C6;
}

/* The "Continue reading" button */
a.more-link {
	background-color: #005C8F;
	border-radius: 5px;
}

a.more-link:hover {
	background-color: #0A3971;
}

/* The Posts button on the bottom */
.infinite-scroll #infinite-handle span {
	background-color: #0092C6;
	border-radius: 5px;
}

.infinite-scroll #infinite-handle span:hover {
	background-color: #005C8F;
	border-radius: 5px;
}

/* The footer wrapper */
div#footer.footer-wrap {
	background-color: #fff;
}

/* The titles on the post page */
.entry-title {
	color: #005C8F;
}

/* The buttons for previous and next posts on the post page */
.nav-links .nav-previous a {
	background-color: #005C8F;
	border-radius: 5px;
}

.nav-links .nav-previous a:hover {
	background-color: #0A3971;
	border-radius: 5px;
}

.nav-links .nav-next a {
	background-color: #005C8F;
	border-radius: 5px;
}

.nav-links .nav-next a:hover {
	background-color: #0A3971;
	border-radius: 5px;
}